[javascript] react 들어가기 전! javascript 복습 (실전1)

1. Truthy & Falsy

const getName = (person) => {
  if (person === undefined || person === null) {
    return "객체가 아닙니다";
  }
  return person.name;
};

let person = null;
const name = getName(person);
console.log(name);

//////////////////////////////////////// ->

const getName = (person) => {
  if (!person) { 
    //false NOT => True
    return "객체가 아닙니다";
  }
  return person.name;
};

let person;
const name = getName(person);
console.log(name);

 

person === undefined || person === null -> !person ( false NOT => True )

---

2. 삼항연산자

let a = 3;
  if (a >= 0) {
    console.log("양수");
  }else {
    console.log("음수");
}

//////////////////////////////////////////////////////////// ->

//삼항연산자
let a = -3;
a >= 0 ? console.log("양수") : console.log("음수");

 

아래 예문과 같이 사막연산자를 사용하여 줄여서 쓰기가 가능하다. (음수/양수 모두)

let a = [];

if(a.length === 0){
  console.log("빈 배열");
} else {
  console.log("안 빈 배열");
}

//////////////////////////////////////////////////////->

//배열도 줄이기 가능
a.length === 0 ? console.log("빈 배열") : console.log("안 빈 배열");

//////////////////////////////////////////////////////->

//변수를 사용하여 더 짧게 줄이는것도 가능
const arrayStatus = a.length === 0 ? "빈 배열" : "안 빈 배열";

 

배열도 1줄로 줄이기 가능하다.

// 학점 계산 프로그램 예제
// 90점 이상 A+
// 50점 이상 B+
// 둘다 이니면 F

// 가독성이 떨어진다
let score = 90;

score >= 90 
? console.log("A+") 
: score >= 50 
? console.log("B+")
: console.log("F")

////////////////////////////////////////////->

//이런경우 if문 사용하면 가독성이 높아진다
let score = 90;

if(score >= 90) {
  console.log("A+");
} else if (score >= 50){
  console.log("B+");
} else {
  console.log("F");
}

 

조건문이 길어지는경우 삼항연산자보다는 if문을 사용하여 정리하면 가독성이 높다.

 

* 참고 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Conditional_operator

---

3. 단락 회로 평가

//논리연산자 복습

// end 연산자 
console.log(true && true);
console.log(false && true);
// end연산자는 양쪽에 피연산자가 둘다 true이일때만 true이기 때문에 앞이 false면 and에 오는값은 신경쓰지 않아도 된다.

// or연산자
console.log(true || false);
//or연산자도 앞의 값이 true면 단락회로평가가 이루어져 뒷 값이 중요하지 않게된다.

// not 연산자
console.log(!true);

const getName = (person) => {
  const name = person && person.name;  //값 저장
  return name || "객체가 아닙니다"
  // if (!person) {
  //   return "객체가 아닙니다";
  // }
  // return person.name;
};

// let person = {name : "이름"};
let person = null;
// 값이 null이면 "객체가 아닙니다" 반환

const name = getName(person);
console.log(name);