본문 바로가기
728x90

Sesac21

[SeSAC] 조건문 조건문if (조건식) { // 조건식이 참일 때 실행될 내용} else if (조건식) { // if문의 조건식이 거짓이고, // else if의 조건식이 참일 때} else { // 그 외 모든 경우} 조건식의 결과는 boolean이 되어야한다.Truthy, Falsy조건식에 첨가 되었을 때 참, 거짓이 되는 값이 있다.참(True)true0이 아닌 모든 수, Infinity 포함빈 문자열이 아닌 문자열Object에 해당하는 객체[], {}, Map, Set거짓(False)false0, -0'', "", `` (빈 문자열)null, undefined, NaN그 외에는 비교 연산자, 논리 연산자의 결과값이 가능하다예시let score = 75;if (score >= 90) { console.log('A.. 2024. 10. 24.
[SeSAC] 연산자 연산자의 종류산술 연산자 : 수학적 계산을 처리한다.할당 연산자 : 값을 변수에 할당한다.비교 연산자 : 두 값의 크기나 동등성을 비교한다.논리 연산자 : 논리적인 참/거짓을 계산한다.타입 연산자 : 변수의 자료형을 확인하거나 변환한다.산술 연산자+ 더하기- 뺄셈* 곱셈/ 나눗셈% 나머지 : 두 수를 나눈 후 나머지를 반환한다.** 거듭제곱 : 숫자의 거듭제곱을 계산한다.++ 증가연산자 : 변수를 1 증가시킨다.-- 감소연산자 : 변수를 1 감소시킨다.let a = 7;let b = 2;console.log(a + b); // 9console.log(a - b); // 5console.log(a * b); // 14console.log(a / b); // 3.5console.log(10 % 3); // .. 2024. 10. 23.
[SeSAC] 선언과 할당 변수, 상수 선언선언데이터를 담을 공간에 이름을 작성하는 과정할당선언된 이름에 데이터를 담는 과정 변수(變數, 변하는 수, variable)let 키워드선언된 변수에 할당된 값이 변할 때데이터 재할당이 가능하다let city = 'seoul'num = 'busan'상수(常數, 항상 같은 수, 변하지 않은 수, constrant)const 키워드선언된 상수에 할당된 값이 변하지 않을 때데이터 재할당이 불가능하다재할당 시 TypeError가 발생한다.const num = 1num = 4 // 에러 발생TypeError: Assignment to constant variable.// 타입에러 : 상수 변수에 할당 공통 사항동일한 이름으로 재선언이 불가하다네이밍 규칙알파벳, 숫자, 밑줄(_), 달러 기호($)만.. 2024. 10. 23.
[SeSAC] JavaScript(Node.js) Node.jsChrome V8 JavaScript 엔진 위에서 구축된, 서버 측에서 실행 되는 JavaScript 환경이다.즉, 브라우저 환경이 아닌 곳에서 JS 파일을 실행시킬 수 있다. https://nodejs.org/en  Node.js — Run JavaScript EverywhereNode.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.nodejs.org 다운로드한 파일을 실행하여 Next를 계속 클릭하면 설치된다. JavaScript는 웹 페이지를 컨트롤할 수 있는 유일한 언어로 JS 기반으로 만들어진 어려 라이브러리와 프레임워크가 존재한다.설치 후 VSCode에서 js파일을 만들어 실행한다. 2024. 10. 21.
[SeSAC] CSS(Flex) 구성 요소들을 유연하게 만들어주는 역할을 한다.부모요소에 display: flex;를 적용하여 컨테이너를 만들어 자식요소에 적용할 수 있다.자손들에게는 적용되지 않아 추가로 속성을 작성해야 한다.부모요소와 자식요소에게 부여하는 속성 값을 정리해보자부모 요소플렉스 컨테이너에 해당한다.justify-content : 주 축(main-axis)을 따라 플렉스 아이템을 정렬한다.flex-start : 아이템을 시작점에 정렬flex-end : 아이템을 끝점에서 정렬center : 아이템을 가운데 정렬space-between : 아이템 사이에 동일한 간격, 양 끝에 여백이 없다.space-around : 아이템 주위에 동일한 간격, 양 끝에 동일한 여백이 있다.flex-direction : 플렉스 아이템이 배치될 .. 2024. 10. 21.
[SeSAC] CSS(박스 모델, 요소 조정) 박스 모델(Box Model)요소가 웹 페이지에서 차지하는 영역을 정의하는 방법이다.박스 모델은 4가지 요소가 있다.콘텐츠(content) : 실질적인 내용이 담겨있는 공간으로 텍스트나 이미지가 들어간다.제어 속성 : width {값}, height {값}패딩(padding) : 콘텐츠와 테두리 사이에 공간으로 요소의 내부 여백을 적용한다.제어 속성 : padding {값}테두리(border) : 패딩과 마진 사이의 위치하여 가장자리 부분을 감싼다제어 속성 : border {두께} {모양} {색상}마진(margin) : 요소의 외부(바깥) 공간으로 여백, 간격을 설정한다.제어 속성 : margin {값}box-sizingwidth와 height 에 padding과 border 포함할지 여부를 결정한다.b.. 2024. 10. 16.