[ES6][JS] Javascrip 기타 문법(삼항연산자,구조 분해 할당문법등)

◆목표

Javascript 기타 문법
- 삼항 연산자
- 함수 마라 미터 값 설정
- 구조 분해 할당 문법
- Rest 파라미터
- Spread 파라미터

---

1. 삼항 연산자

   1) 문법

조건? 조건이 True일 때 결괏값: 조건이 False일때 결과값

   2) 예제

       - 삼항 연산자 사용 전

const nums=[2,3];
let isNum='';

if(nums.length==0){
  isNum='빈 배열';
}
else{
  isNum='아이템이 있는 배열';
}

       - 삼항연산자 사용 후

const nums=[2,3];
let isNum='';

isNum = nums.length==0? '빈 배열': '아이템이 있는 배열';

2. 함수의 기본 인자(파라미터) 값 설정

  1) 문법

function 함수명(파라미터명=디폴트 값){};

   2) 예제

       - 인자 값을 넣지 않을 때 (undefiend 출력됨)

function f(name){
  console.log(name);
}
f();

       - 인자 값을 넣었을 때 (dave 출력됨)

function f(name = "dave") {
  console.log(name);
}
f();

3. 구조 분해 할당(비구조화 할당) 문법

- 배열이나 객체들 중 이해하기 어려운 구조로 되어있는 속성을 분해하고 개별 변수로 재할당하는 문법

 

  1) 문법

- let {배열, 객체에서 분할할 프로퍼티명} = 배열 or 객체명
- let {배열, 객체에서 분할할 프로퍼티명: 새로 사용할 프로퍼티명} = 배열 or 객체명
- let {배열, 객체에서 분할할 프로퍼티명, 변수명='디폴트 값'} = 배열 or 객체명

   2) 예제

       - 객체에서 분할할 프로퍼티명을 그대로 사용할 때 

let data={
  name:'dave',
  age:23
};

let {age} = data;
console.log(age);

       - 객체에서 분할할 프로퍼티명을 다른 프로퍼티명으로 사용하려고 할 때

let data = {
  name: "dave",
  age: 23
};

let { name: afterName } = data;
console.log("객체 구조 분해 할당 후: " + afterName);

      - 객체에서 분할할 프로퍼티명을 다른 프로퍼티명으로 사용하고, 객체에 프로퍼티명이 없다면 디폴트 값을 설정하려고 할 때

let data = {
  name: "dave",
  age: 23
};

let { name, hobby = "코딩" } = data;
console.log(name, hobby);

    - 배열에서 분해 할당할 때 (출력 : 1,2,3, undefined)

      (배열을 분해 할당할 때는 배열의 인덱스 순서대로 분해됨)

let arr = [1,2,3];

let [first,second,third,fourth] = arr;
console.log(first);
console.log(second);
console.log(third);
console.log(fourth);

//원하는 인덱스 값만 분해할때
let [,,third] = arr;
console.log(third);

4. Rest 파라미터

- 함수의 파라미터로 오는 값들을 '배열'로 전달받을 때 사용

 

  1) 문법

- function f(...배열파라미터){};
//일반 파라미터와 같이 사용할 때 Rest 파라미터를 맨 마지막에 선언해줘야 함
- function f(일반 파라미터1, 일반 파라미터2, ...배열파라미터)

   2) 예제

function f(...rest) {
  console.log(rest);
}
function f1(rest) {
  console.log(rest);
}
//배열로 인지함(1,2,3 출력됨)
f(1, 2, 3); 
//1만 파라미터로 인지함(1 출력됨)
f1(1, 2, 3);

5. Spread 파라미터

- Rest 파라미터와 마찬가지로... 을 붙여서 정의함

- 배열을 개별적으로 분할하여 하나의 문자열로 사용함

 

  1) 문법

...배열명

   2) 예제

       - 예제 1번(출력: 1 2 3)

let arr = [1, 2, 3];

console.log(...arr);

      - 예제 2번(출력: 1 2 3)

let arr = [1, 2, 3];
function arrSplit(a, b, c) {
  console.log(a);
  console.log(b);
  console.log(c);
}

arrSplit(arr);

     - 예제 3번(출력: 1,2,3,4,5)

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