Language 썸네일형 리스트형 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'도 같다고 반환한다. 이는 부정확성을 초래하여 안 쓰는 .. 더보기 산술 할당 증감 연산자 1. 산술 + - x / %(나머지 연산자) 2. 할당 // var -> 재선언 재할당 전부 가능 // let -> 재선언 불가 재할당 가능 let a = 3 a = 5 // ok let a = 3 let a = 2 //Error // const -> 재선언 재할당 전부 불가능 const a = 3 a =4 //Error 3. 증감 let a = 2 console.log(++a) console.log(a) // 해당 출력문 실행하기 전에 a 값에 1을 더해라 (출력 3 3) console.log(a++) console.log(a) // 해당 출력문 실행 후에 a에 1 더해라 (출력 2 3) 더보기 Type 확인 //데이터 타입 확인 // console.log(typeof a) // 근데 이걸로는 null, 배열[] 객체{} 는 확인하지 못한다. // Js에서는 함수도 타입으로 친다. console.log(typeof 'hello' === 'string') console.log(typeof 123 === 'number') console.log(typeof false === 'boolean') console.log(typeof undefined === 'undefined') console.log(typeof null ==='object') console.log(typeof[] === 'object') console.log(typeof{} === 'object') console.log(typeof function (.. 더보기 참과 거짓 // 참과 거짓 /* * -- boolean으로 받아들여질 시 거짓으로 간주되는 것 * (1) false * (2) 0, * (3) null, * (4) undefined * (5) NaN * (6) '' -> 빈 문자열 * (7) 0n -> Bigint란 타입으로 0을 나타낸것. * --이외에 모든 숫자 문자는 전부 참-- * 배열은 비어있어도 참임 * NaN은 잘못된 수학 계산, 잘못된 숫자를 의미한다. * ex) 0/0 ===NaN(잘못된 수학 계산), 100/"hi" === NaN (잘못된 숫자) * */ if(null){ console.log('참') } else{ console.log('거짓') } 더보기 Component가 무엇인지, Props로 상위 컴포넌트에서 하위 컴포넌트로 값 주고 받기 1.컴포넌트 : 재사용이 가능한 개별적인 여러 조각 UI(User Interface)는 여러 개의 Component로 나뉜다. 카톡 화면은 위와 같이 5개의 컴포넌트로 나뉘는 것이다. 컴포넌트는 java로 치면 매소드 같은 녀석이다. 2. 컴포넌트의 종류 (1) 클래스형 컴포넌트 a. 쓰기 위한 조건 - React.Component라는 클래스를 무조건 상속해야 함. - render() 라는 함수를 사용해야 하고, 위 함수의 return 값에다가 하고 싶은 내용물을 적어야함. b. state, lifestyle(생명 주기)라는 기능을 사용할 수 있음. c. 함수 형 컴포넌트보다 메모리를 더 사용한다는 단점. (2) 함수형 컴포넌트 a. state, lifestyle이라는 기능을 사용하지 못함. 따라서 Ho.. 더보기 일치 연산자와 동등 연산자 유형 형태 뜻 예시 ===(일치 연산자) a === b a와 b가 type이 같은지 check type이 같다면 값이 같은지도 check 1 === 1 // true 1 === "1" // false 1 === true // false ==(동등 연산자) a == b 연산자가 a,b를 형 변환 해가며, 내용물이 같은지를 check 0 == 0 // true 0 == [ ] // true 0 == false // true 동등 연산자 사용 시 헷갈리는 경우가 많아 가독성이 저하되므로, 일치 연산자를 되도록이면 사용할 것! 더보기 이전 1 2 3 4 5 6 ··· 11 다음
