javascript note.1

Truthy and Falsy

Falsy : undefined, null, 0, "", NaN(Not a Number)
Truthy : Falsy에 해당하는 값 이외의 값들.

단축평가 논리 계산법(&& , ||)

데이터를 불러와 map돌릴때 자주 사용하였던
&&에 대해 알아보고 ||에 대해 알아보도록 하겠습니다.
우선 자주 사용했던 양식을 살펴보면,

{data && data.map((element, index) => {
return (<li key={index}>
                  {element.text}
        </li>)})

에서 data에 대한 값이 true일때 map을 활용할 수 있었다.
그럴때 사용했던게 바로 &&
만약 data에 대한 값이 true가 아닐경우 undefined error가 뜨는걸
확인 할 수 있었을 것이다.

기본적인 구조를 확인해보면

true && true // true
true && false // false
true || false // true
false || true // true

이렇고, 아래서 더 확인해보도록 하겠다.

&&

console.log(true && 'hello'); // hello
console.log(false && 'hello'); // false
console.log('hello' && 'bye'); // bye
console.log(null && 'hello'); // null
console.log(undefined && 'hello'); // undefined
console.log('' && 'hello'); // ''
console.log(0 && 'hello'); // 0
console.log(1 && 'hello'); // hello
console.log(1 && 1); // 1

위에서 살펴 봤듯이 && 첫번째에 해당하는 값이 false일경우 false값이
출력되는걸 확인해 볼 수 있다.

||

function getSound(animal){
  const sounds = {
    개: '멍멍',
    고양이: '야옹',
    참새: '짹짹',
    비둘기: '구구구구'
  };
  return sounds[animal] || '…?';
}
console.log(getSound(''))

일경우 getSound('') 값은 인자가 false이기 때문에 ...? 값이 뜬다.
위의 &&와 다르게 ||에서 true일 경우 첫번째에 해당하는 값이 뜨는걸 볼 수 있다.