220421

KEEP

• 자바스크립트 뽀개기

  • array의 메서드 filter는 array에 관한 메서드이므로 callback 함수는 해당 array의 요소들을 매개변수로 받는다. 즉, [1, 2, 3].filter(function(number)~에서 number는 array의 요소인 1, 2, 3이 된다.

• ES6(참고: poiemaweb)

  • 기본 매개 변수(매개변수 기본값): 함수 정의 시 기본 매개변수의 기본값을 선언하면 함수 내에서 인수를 체크하거나 초기화하지 않아도 되고, 이 기본값은 매개변수에 인수를 전달하지 않았을 때만 유효

    //b에만 디폴트값이 있는 경우 -> 디폴트값이 있는 매개변수는 뒤쪽에
    function multiply(a , b = 1) {
        return a * b;
    }
    
    console.log(multiply(1)); // 1
    console.log(multiply(1, 2)); // 2

  • 스프레드(...): 대상을 개별 요소로 분리 ex.배열...[1,2,3]은 1, 2, 3으로, 문자열..."hello"는 h, e, l, l, o로 분리

    • 배열의 경우, 스프레드를 이용해서 concat, push, splice, copy 등의 메서드를 간결하게 이용할 수 있음 -> 객체도 비슷

    //ES5 push
    const arr1 = ["h", "e", "l"];
    const arr2 = ["l", "o"];
    
    Array.prototype.push.apply(arr1, arr2);
    
    console.log(arr1); // [ "h", "e", "l", "l", "o" ]
    
    //ES6
    const arr1 = [1, 2, 3];
    const arr2 = [4, 5, 6];
    
    // ...arr2는 ["l", "o"]을 개별 요소로 분리
    arr1.push(...arr2); // == arr1.push("l", "o");
    
    console.log(arr1); // [ "h", "e", "l", "l", "o" ]

  • Rest 매개변수(...): 함수에 전달된 인수들의 목록을 배열로 전달받음 -> 스프레드와 구분할 것

  • 디스트럭처링(Destructuring): 구조화된 배열(순서 상관O) 또는 객체(순서 상관X)를 비구조화해서 개별 변수에 할당 -> 객체 비구조화가 더 자주 쓰임

    //배열 비구조화
    const raceResults = ['MonstaX', 'MonstaY', 'MonstaZ'];
    const [ gold, silver, bronze] = raceResults;
    gold; //'MonstaX'
    silver; //'MonstaY'
    bronze; //'MonstaZ'
    
    //rest 매개변수
    const [ real, ...nothing ] = raceResults;
    real; //'MonstaX'
    nothing; //['MonstaY', 'MonstaZ']
    
    //객체 비구조화
    const monstaX = {
        leader: 'Shownu',
        leadDancer: 'Hyungwon',
        mainVocal: 'Kihyun'
    }
    
    const { leadDancer: bias } = monstaX; //const bias = monstaX.leadDancer;

---

PROBLEM

• 리액트도 슬슬 시작해야 할 것 같다
  • 자바스크립트 끝낸 다음에 시작하려고 했는데, 지금부터 병행해야 할 듯.

---

TRY

• 내일부터 리액트도 조금씩
  • 할 게 너무 많다, 하지만 오히려 좋아...~