Truthy, Falsy, 단축 평가 논리 계산법, 함수 기본파라메터

2020. 4. 20. 16:59TypeScript&JavaScript/JavaScript

자바스크립트에서 false가 기본인 몇 가지 값들이 있다. 이외에는 전부 기본적으로  true를 반환한다.(boolean에서)

위 5가지의 값에 부정형(!)을 붙이면 true를 반환하게된다. 마찬가지로, truthy한 대부분의 값에 !를 붙이면 false를 반환한다. 이러한 특징은 삼항연산자와 함께 이용한다면 조건문의 길이를 줄여서 간결하게 코딩을 하는 것에 도움이 된다.

//falsy

console.log(!undefined);
console.log(!null);
console.log(!0);
console.log(!'');
console.log(!NaN);

 

단축 평가 논리 계산법은 논리연산자를 이용해 코드를 단축하는 방식에 가깝다. 개인적으로는 여러사람과 협업할 경우 이러한 표현방식이 사람들과 일반적으로 익숙하게 쓰이고 있는지를 파악하는게 좋다고 느낀다. 간결해지는 장점이 있는건 확실하지만, 이러한 표현을 읽는것에 익숙치 않을 경우 협업에 어려움을 느낄 수도 있다.

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

//&&에 대한 예시
const dog = {
  name: '멍멍이'
};

function getName(animal) {
  if (animal) {
    return animal.name;
  }
  return undefined;
}

const name = getName(dog);
console.log(name); // 멍멍이, dog에 name 값이 비어있을경우 undefined리턴


//연산자를 사용할 경우
function getName(animal) {
  return animal && animal.name;
}

//&& 에 대한 속성 특징
// A가 truthy한 값이면 B가 결과값이 되고, A가 Falsy한 값이면 결과는 A가 되는 특징이 있다

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




//|| 에 대한 예시

const namelessDog = {
  name: ''
};

function getName(animal) {
  const name = animal && animal.name;
  if (!name) {
    return '이름이 없는 동물입니다';
  }
  return name;
}

const name = getName(namelessDog);
console.log(name); // 이름이 없는 동물입니다.

//연산자 || 사용 시

const namelessDog = {
  name: ''
};

function getName(animal) {
  const name = animal && animal.name;
  return name || '이름이 없는 동물입니다.';
}

const name = getName(namelessDog);
console.log(name); // 이름이 없는 동물입니다.

// ||(or)연산자의 특징, A가 falsy하면 B가 결과값이 된다
console.log(false || 'hello'); //hello
console.log('' || '이름없다'); //이름없다
console.log(null || '널이다~'); //널이다
console.log(undefined || 'defined 되지 않았다!'); //definded 되지 않았다!
console.log(0 || '제로다'); //제로다

// A가 truthy하면 B는 고려도 하지 않는다
console.log(1 || '음?'); // 1
console.log(true || '여기 안본다.'); // true
console.log('와아' || '여기 안봐요'); //와아
console.log([] || '노노'); // []​

함수기본파라메터는 ES6에서는 아래처럼 함수의 파라메터에 이퀄을 사용하여 선언할 수 있다. 이는 파라메터가 없을 경우에만 동작하고, 파라메터가 있는 경우에는 해당 파라메터의 값으로 적용된다. 함수의 파라메터가 없을 경우 특정한 값을 리턴하게 하고 싶을 때 유용하다.

function calculateCircleArea(r = 1) {
	return Math.PI * r * r;
}

const calculateCircleArea = (r = 1) => Math.PI * r * r;

const area = calculateCircleArea()
console.log(area); // 파라메터가 들어갈경우 r에 그 값이 들어가 계산된 값, 아닐경우 1이 들어간 값