ES6

(1) let(변수), const(상수)

• 2015년도 이전 => var

(2) arrow function

• function add() {};

• let add = function() {};

• let add = (x) => { return 1;};

• let add = (x) => 1;

(3) 삼항 연산자

• condition ? true : false

1. 구조분해할당 : destructuring(de + structure + ing)

• (de = not)
• structure = 구조
• 배열이나, 객체의 속성

(1) 배열의 경우

    let [value1, value2] = [1, "new"];
    console.log("1", value1);
    console.log("2", value2);

    let arr = ["v1", "v2", "v3"];
    let [a, b, c, d] = arr;
    console.log(a);//v1
    console.log(b);//v2
    console.log(c);//v3
    console.log(d);//undefind

(2)객체인 경우

    let user1 = {
        name1: 'abc',
        age1: 35,
    };

단축 속성명 : property shorthand

    const name = 'abc';
    const age = '30';

    //key - value
    const obj = { name, age,};
    console.log(obj);//{ name: 'abc', age: '30' }

2. 전개 구문 = spread operator

destructuring과 함꼐 가장 많이 사용되는 es6 문법 중 하나!

    let arr = [1, 2, 3];
    console.log(arr); //[ 1, 2, 3 ]
    console.log(...arr); // 1 2 3
    //이 구조를 벗어버리고 새로운 구조로 독립할 때 많이 쓰임

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

3. 객체

    let user = {
        name: 'abcd',
        age: 30,
    };

    let user2 = { ...user };
    console.log(user); //{ name: 'abcd', age: 30 }
    console.log(user2); //{ name: 'abcd', age: 30 }

4. 나머지 매개변수(rest parameter)

    function exampleFunc(a,b,c, ...args) {
        console.log(a, b, c);
        console.log(...args);
        console.log(args);
    }

    exampleFunc(1,2,3); 
    // 1 2 3
    //
    //[] 
    exampleFunc(1,2,3,4,5,6,7)
    //1 2 3
    //4 5 6 7
    //[ 4, 5, 6, 7 ]

5. 템플릿 리터럴(template literal)

    console.log(`Hello ${3+3}`); // Hello 6
    console.log(`
    hello
           my name is JS!

           nice to meet you!
    `);

6. 일급객체로서의 함수

(1) 변수에 함수를 할당할 수 있다.

• 함수가 마치 값으로 취급한다.
• 함수가 나중에 사용될 수 있도록 조치가 되었다.

      const sayHello = function () {
          console.log('Hello!');
      };

      sayHello(); // "Hello!" 출력

(2) 함수를 인자로 다른 함수에 전달

2-1. 콜백함수 : 매개변수로써 쓰이는 함수

2-2. 고차함수 : 함수를 인자로 받거나 return하는 함수

    function callFunction(func) {
        func();
    }

    const sayHello2 = function () {
        console.log('Hello2!');
    };

    callFunction(sayHello2); // "Hello2!" 출력

(3) 함수를 반환

    function createAdder(num) {
        return function(x) {
          return x + num;
        }
      }

      const addFive = createAdder(5);
      console.log(addFive(10)); // 15 출력

(4) 객체의 프로퍼티로 함수를 할당

    const person = {
        name: 'John',
        age: 30,
        isMarried: true,
        sayHello: function() {
          console.log(`Hello, my name is ${this.name}`);
        },
        sayHello2: () => {
          console.log(`Hello, my name is ${this.name}`);
        }
      };

      person.sayHello(); // "Hello, my name is John" 출력
      person.sayHello2(); // "Hello, my name is undefined" 출력 - 화살표함수는 this를 바인딩하지 않는다.

(5) 배열의 요소로 함수를 할당

      const myArray = [
        function(a, b) {
          return a + b;
        },
        function(a, b) {
          return a - b;
        }
      ];

      console.log(myArray[0](5, 10)); // 15 출력
      console.log(myArray[1](10, 5)); // 5 출력

      function multiplyBy(num) {
        return function(x) {
          return x * num;
        }
      }

      function add(x, y) {
        return x + y;
      }

      const multiplyByTwo = multiplyBy(2);
      const multiplyByThree = multiplyBy(3);

      console.log(multiplyByTwo(10)); //20
      console.log(multiplyByThree(10)); //30


      const result = add(multiplyByTwo(5), multiplyByThree(10)); 

      console.log(result);// 40 출력

7. Map

• JS -> 객체, 배열 : 많고, 다양하고, 복잡한 프로그램을 만들어 왔지만
  그럼에도, 현실세계 반영하기는 많은 어려움이 존재했다. 그리하여 Map, Set 같은 추가적인 자료구조가 등장했습니다.

• Map, Set의 목적 : 데이터의 구성, 검색, 사용을 효율적으로 처리 -> 기존의 객체 또는 배열보다

(1) Map

• key/value
• key에 어떤 데이터 타입(유형)도 다 들어올 수 있다.
• Map은 키가 정렬된 순서로 저장되기 떄문이다.
• 기능 : 검색, 삭제, 제거, 여부 확인

      const myMap = new Map();
      myMap.set('key', 'value');
      myMap.get('key');
      //반복을 위한 method : keys, values, entries

      const myMap = new Map();
      myMap.set('one', 1);
      myMap.set('two', 2);
      myMap.set('three', 3);

      console.log(myMap.keys()); // [Map Iterator] { 'one', 'two', 'three' }
      for (const key of myMap.keys()) {
        console.log(key);
      }

      for (const value of myMap.values()) {
        console.log(value);
      }

      for (const entry of myMap.entries()) {
        console.log(`${entry[0]}: ${entry[1]}`);
      }


      console.log(myMap.size); // 3 출력
      console.log(myMap.has('two')); // true 출력

8. set

• 고유한 값을 저장하는 자료구조이다.
• 값만 저장한다.
• 키를 저장하지는 않는다.
• 값이 중복되지 않는 유일한 요소로만 구성된다.
• 값 추가, 검색, 값 삭제, 모든 값 제거, 존재 여부 확인

      const mySet = new Set();
      mySet.add('value1');
      mySet.add('value2');
      mySet.add('value3');
      mySet.add('value5');
      mySet.add('value8');

      console.log(mySet.size);
      console.log(mySet.has('value1')); //true
      console.log(mySet.has('value2')); //true
      console.log(mySet.has('value10')); //false

• Iterator, 반복했던 그 친구

      for(const value of mySet.values()) {
          console.log(value);
      }