모던 자바스크립트 2

최정환·2021년 7월 1일
0

자바스크립트의 동작 원리

📋 Symbol

Symbol은 기본형 데이터 타입 중 하나이며 코드 내에서 유일한 값을 가진 변수 이름을 만들 때 사용


  1. Symbol 값을 담게 된 user라는 이름의 변수는 다른 어떤 값과 비교해도 true가 될 수 없는 고유한 변수

  2. 같은 설명을 붙인 심볼을 만들더라도 두 값을 비교하면 false가 반환


const user = Symbol('this is a user');

user === 'this is user'; // false
user === 'user'; // false
user === 'Symbol'; // false
user === true; // false
user === false; // false
user === 123; // false
user === 0; // false
user === null; // false
user === undefined; // false
...

const symbolA = Symbol('this is Symbol');
const symbolB = Symbol('this is Symbol');

console.log(symbolA === symbolB); // false

📋 typeof 연산자

사용하는 값이 어떤 데이터 타입을 가지고 있는지 확인하려면 typeof 연산자를 사용

📌 typeof 연산자의 결과가 모든 타입과 1:1로 매칭되지 않는다

typeof 'Codeit'; // string
typeof Symbol(); // symbol
typeof {}; // object
typeof []; // object
typeof true; // boolean
typeof(false); // boolean
typeof(123); // number
typeof(NaN); // number
typeof(456n); // bigint
typeof(undefined); // undefined

💡 typeof null; // object

📋 boolean?

if(something){~}
else{~}

// something
Truthy					Falsy
Boolean(true);			Boolean(false);
Boolean('some');		Boolean(null);
Boolean(452);			Boolean(NaN);
Boolean({} or []);		Boolean('');
    so on 				Boolean(undifined);
     					Boolean(0);

something은 Truthy, Falsy로 나뉘어져 값에 따라 true, false가 정해진다.

📋 And, OR 연산자

💡 AND 연산자가 OR 연산자보다 우선순위가 높다.

And연산자는 왼쪽이 true면 오른쪽 값 출력, false면 왼쪽 값 출력

Or연산자는 왼쪽이 true면 왼쪽 값 출력, false면 오른쪽 값 출력

// And
console.log('so'&&'me') // me
console.log(false && true) // true
console.log(true && false) // true
console.log(false && false) // false

//Or 
console.log(true || true) // true
console.log(false || true) // true
onsole.log(false || false) // false
onsole.log({} || 123) // {}
console.log('so'||'me') // so

null 병합 연산자??


물음표 2개 (??)를 사용해 null 혹은 undifined 값을 가려내는 연산자.

ex1과 ex2같이 연산자 왼편의 값이 null 이나 undefined라면 연산자 오른편의 값이 리턴
ex3같이 연산자 왼편의 값이 null 이나 undefined가 아니라면 연산자 왼편의 값이 리턴

const ex1 = null ?? 'I';
const ex2 = undefined ?? 'save';
const ex3 = 'money' ?? 'person'

console.log(ex1,ex2,ex3); // I save money

or연산자와 비슷해 보이지만 or연산자는 왼쪽 값이 falsy인지 확인하기 때문에 null이나 undefined가 아닌 falsy 값을 활용할 때 결과가 서로 다르다.

const title1 = false || 'codeit';
const title2 = false ?? 'codeit';

console.log(title1); // codeit
console.log(title2); // false

const width1 = 0 || 150;
const width2 = 0 ?? 150;

console.log(width1); // 150
console.log(width2); // 0

0개의 댓글