본문 바로가기

Language/JS

For 반복문, For of, For in 1. For 반복문 // 선언부 ; 조건부; 증감연산부; // 조건에 맞는지 확인 -> loop 돌릴려는 명령 실행 -> 증감 연산 -> 조건에 맞는지 확인 (반복) for (let i = 0; i < 10; i++) { console.log(i); } (1) break loop를 돌다가 break를 만나면 그 자리에서 탈출 i가 9가 되는 순간 탈출. (2) Continue continue를 만나면, 해당 키워드 밑의 코드들은 실행하지 않고 다시 loop로 돌아감. if 조건 만족해서 continue 만나면 밑의 문장들 실행하지 않고, 바로 loop문으로 넘어감. if 조건 만족 못해서 지나갈 경우 , 그대로 console.log 찍힘. 2. For of 반복문 (배열에서 쓰임) java에서의 for .. 더보기
If와 Switch 문 1. if 2. switch 문 (1) 형태 let comment = ""; age = 14; switch (age) { case 14: comment = "중학교 1학년"; break; case 15: comment = "중학교 2학년"; break; case 16: comment = "중학교 3학년"; break; case 17: comment = "고등학교 1학년"; break; case 18: comment = "고등학교 2학년"; break; case 17: comment = "고등학교 3학년"; break; default: comment = "성인이거나 초등학생입니다."; } console.log(comment); 인수로 받은 값을 case 에 적혀있는 값들과 차례대로 비교한다. 그 중 일치하.. 더보기
선택적 체이닝(Optional Chaining) **완전 잘 보고 배운 곳 ** 옵셔널 체이닝 '?.' (javascript.info) 옵셔널 체이닝 '?.' ko.javascript.info 1. Optional Chaining 이 생긴 이유 (1) 생긴 이유 객체 안의 멤버의 값을 얻기 위해 점 표기법으로 접근했는데, 그 멤버가 존재하지 않는 순간이 있다. 이 경우 원래라면 에러가 난다. const User {} console.log(user.adderess); // syntax error 이와 같이 우리가 객체 안의 특정 멤버에 접근하려고 하지만, 그 멤버가 있는지 없는지 모르는 경우에 Error를 피하기 위해 OptionalChaing이 만들어진 것이다. (2) Optional Chaining 없었을 땐 어떻게 이 문제를 해결했나요? && 이 .. 더보기
구조 분해 할당 1. 구조 분해 할당이란? 만약 우리가 배열에서 원소를 일일히 빼서 변수에 집어 넣는다면, 다음과 같은 과정을 거쳐야 할 것이다. const arr = [1,2,3] const a = arr[0] const b = arr[1] const c = arr[2] JS에서는 위 과정을 간단하게 한 줄의 코드로 적을 수 있는 방법이 있다. 이를 구조 분해 할당이라고 한다. 배열이나 객체의 원소들을 찢어서 변수 하나 하나에 넣어주는 방식을 말한다. 2. 배열에서의 구조 분해 (1) 기본형 // 배열 선언 const arr = [1,2,3] // 구조 분해 할당 이용: 변수 a, b, c에 각각 1, 2, 3이 차례로 들어간다. const [a,b,c] = arr console.log(a,b,c) // 1 2 3이 .. 더보기
전개 연산자 1. 정의 (1) 형태 const a = [1,2,3] console.log(a) // [1,2,3] console.log(...a) // 1,2,3 const b = {a:'apple', b: 'banana', c: 'car'} const c = {d:'digest', e: 'earth', f: 'fool\'s day'} const r = {...b,...c} console.log(r) // {a:'apple', b: 'banana', c: 'car', d:'digest', e: 'earth', f: 'fool\'s day'} (2) 정의 배열이나 객체의 원소들을 차례대로 전개하는 연산자이다. 배열의 대괄호나, 객체의 중괄호를 벗긴다. ** console.log() 에 여러 개의 data를 찍는 법 ,.. 더보기
Nullish 병합 과 삼항 연산자 1. Nullish병합 (1) 정의 const num = A ?? B ?? C ... // null 이나 undefined가 아닌 맨 처음 만난 data를 반환 // 만약 연산자 안에 모든 값들이 null 이나 undefined 라면 맨 마지막의 nullish 값을 반환 // (null , undifined 합쳐서 nullish라고 한다.) OR은 false가 아닌 맨 처음 만난 data를 반환 하는 연산자였다. Nullish 병합은 OR 보다 거르는 범위가 적어진 연산자이다. (2) 예시들 a. OR 과 Nullish의 차이 0은 false 값이고, 7이 제일 먼저 만난 0이 아닌 값임으로 7을 반환 0은 제일 처음 만난 nullish가 아닌 값임으로 0을 반환 b. 다양한 연산들 2. 삼항 연산자 (.. 더보기
논리 연산자 && || 1. 그리고 && (1) 정의 A&&B 는 A, B 둘 다 참이여야지만 참을 반환 const A = true const B = true if (A&&B) { console.log('A,B 둘 다 참이다.') } // A,B 둘 다 참이다 반환 (2) JS만의 특이점 위에서 그냥 'A,B 둘 다 참이면 참을 반환' 한다고 말했지만, JS는 다른 언어들과 달리 여기서 그치지 않고 자기들만의 규칙이 있다. 만약에 A&&B 자체를 console에 찍는다고 하자. 다른 언어 같았으면, A = 0 , B = 1 이면 false를 찍는다. (0은 거짓, 0이 아닌 숫자는 모두 참 취급을 하므로 ) 하지만 JS는 0이 출력된다. 이렇게 되는 이유는 JS 만의 규칙이 존재하기 때문이다. JS에서의 && 연산자는 가장 먼.. 더보기
부정, 비교 연산자 1. !이거 붙이면 boolean 값이 toggle이 됨. // 부정(Negation) console.log(!true) console.log(!false) console.log(!0) console.log(!!0) // 중복 toggle이 가능 console.log(!!!0) console.log(!null) console.log(!undefined) console.log(!NaN) console.log(!'') console.log(!{}) console.log(![]) 2. 비교 연산자 //비교 연산자 const a = 1 const b = 3 // 동등 연산자 // (a,b 형이 다를 경우 자동으로 형 변환 해서 비교함. 따라서 0 과 '0'도 같다고 반환한다. 이는 부정확성을 초래하여 안 쓰는 .. 더보기