JS_문법 (1)_삼항연산자, 구조분해 할당1

삼항연산자

조건문을 좀 더 간결하게 표현가능

(가독성은 좀 떨어짐)

조건 ? 참일 때 : 거짓일 때

 

const arr = 'abcdef'
let result = arr.length > 5 ? '5글자 초과입니다.' : '5글자 이하 입니다.'
console.log(result)

>>>
5글자 초과입니다.

 

함수 기본값 설정

function func(item="none data") {
    console.log(item)
}
func('name')
func()

>>>
name
none data

---

구조 분해 할당

배열 or 객체의 속성을 해체해서

값을 개별 변수에 대입하는 방법이다.

 

1. 객체 분해 할당

let user = {
    name : "Kal",
    age : 23
};

// 동일 프로퍼티명을 사용 / 자동으로 매치가 됨
let {age, name} = user;
console.log(name, age);

>>>
Kal 23

// 새로운 변수명에 저장 시 / 아래와 같이 써주기
let {name: user1_name, age:user1_age} = user;
console.log(user1_name,user1_age);

>>>
Kal 23

 

일부만 가져와도 상관없다!

let {name} = user;
console.log(name);

>>>
Kal

 

또한

객체에서 가져올 값을 담을 변수와

새로 만들 변수를 함께 할당할 수 있다.

let {name, team='Kassid'} = user
console.log(name, team)

>>>
Kal Kassid

 

만약

객체에 가져올 값에 대해

기본값을 지정하고 싶다면

let user = {
    name : "Kal",
    age : 23
};

let {name="Someone", age=0} = user
console.log(name, team)

>>>
Kal 23

위처럼 지정을 해주면 된다.

객체에 해당 프로퍼티명이 없다면

기본값이 할당된다.

 

2. 배열 분해 할당

순서대로 1대1 매칭이 된다.

 

let arr = [1, 2, 3, 4];
let [num1, num2, num3, num4] = arr;
console.log(num1, num2, num3, num4);

>>>
1 2 3 4

 

할당을 할 때

기존 배열 아이템 수 < 할당시킬 배열 아이템 수

일 경우 undefined가 들어간다.

let arr = [1, 2];
let [num1, num2, num3] = arr;
console.log(num1, num2, num3);

>>>
1 2 undefined

 

이때, 기본값을 설정하면

해당 값이 할당이 된다.

let arr = [1, 2];
let [num1=0, num2=0, num3=0] = arr;
console.log(num1, num2, num3);

>>>
1 2 0

 

기존 배열 아이템 수 > 할당시킬 배열 아이템 수

let arr = [1, 2, 3, 4];
let [num1, num2] = arr;

>>>
1 2

이 경우에는

앞부터 순서대로 할당이 된다.

 

건너뛰고 할당시키고 싶은 경우

let arr = [1, 2, 3, 4];
let [num1, , num3] = arr;
console.log(num1, num3);

>>>
1 3

위처럼 , , 로 구분을 해주면 된다.

 

한 방에 여러개를 할당시키고 싶은 경우

let arr = [1, 2, 3, 4];
let [num1, ...theOtherNum] = arr;
console.log(num1, theOtherNum);

>>>
1 [ 2, 3, 4 ]

...변수명 으로 써주면

할당을 하고 난 나머지 아이템을 모아서

배열로 반환을 한다.