전체 글

[JavaScript_study] Generator

* Generator : 함수의 실행을 중간에 멈췄다가 재개할 수 있는 기능 ex) Redux Saga > * 을 사용해서 만든다. > 내부에 yield를 사용한다. > yield에서 함수의 실행을 멈출수있다. > next(), return(), throw() 메소드를 가진다. * Generator > iterable (반복이 가능한) - Symbol.iterator 메서드가 있다. - Symbol.iterator는 iterator를 반환해야한다. - for ... of 를 통해서 순회 가능하다. > iterator (반복자) - next 메서드를 가진다. - next 메서드는 value와 done속성을 가진 객체를 반환한다. - 작업이 끝나면 done는 true가 된다. function* fn() { ..

[JavaScript_study] 클로저 (Closure)

* Closure > 함수와 렉시컬 환경의 조합 > 함수가 생성될 당시의 외부 변수를 기억 > 생성 이후에도 계속 접근 가능 function makeAdder(x) { return function(y) { return x + y; } } // 익명함수는 y를 가지고 있고 상위함수인 makeAdder의 x에 접근 가능 const add3 = makeAdder(3); console.log(add3(2)); // 5 // add3의 함수가 생성된 이후에도 상위함수인 makeAdder의 x에 접근 가능 const add10 = makeAdder(10); console.log(add10(5)); // 15 console.log(add3(1)); // 4 // add10과 add3은 서로 다른 환경을 가지고 있다...

[JavaScript_study] Rest parameters, Spread syntax

* arguments > 함수로 넘어 온 모든 인수에 접근 > 함수내에서 이용 가능한 지역 변수 > length / index > Array 형태의 객체 > 배열의 내장 메서드 없음 (forEach, map) function showName(name) { console.log(arguments.length); console.log(arguments[0]); console.log(arguments[1]); } showName("Mike", "Tom"); // 2 // "Mike" // "Tom" * 나머지 매개변수(Rest parameters) function showName(...names) { console.log(names); } showName(); // [] showName("Mike"); // ..

[JavaScript_study] 구조 분해 할당 (Destructuring assignment)

* Destructuring assignment > 구조 분해 할당 구문은 배열이나 객체의 속성을 분해해서 그 값을 변수에 담을 수 있게 하는 표현식 // 배열 구조 분해 let [x, y] = [1, 2]; console.log(x); // 1 console.log(y); // 2 let users = ["Mike", "Tom", "Jane"]; let [user1, user2, user3] = users; // 위의 코드는 아래와 같다. // let user1 = users[0] // let user2 = users[1] // let user3 = users[2] console.log(user1) // "Mike" console.log(user2) // "Tom" console.log(user3) /..

[JavaScript_study] 배열 메소드2 (sort, reduce)

* arr.sort() > 배열 재정렬 > 배열 자체가 변경되니 주의 > 인수로 정렬 로직을 담은 함수를 받음 (* Lodash 라이브러리를 이용하면 코드한줄로 가능) let arr = [1, 5, 4, 2, 3] arr.sort(); console.log(arr); // [1, 2, 3, 4, 5] let arr2 = ['a', 'c', 'd', 'e', 'b']; arr2.sort(); console.log(arr2) // ['a', 'b', 'c', 'd', 'e'] > 인수로 정렬 로직을 담은 함수를 받는 예시 코드 let arr = [27, 8, 5, 13]; function fn(a, b) { return a - b; } arr.sort(fn); console.log(arr); // [5, 8..

[JavaScript_study] 배열 메소드1 (Array methods)

push() : 뒤에 삽입 pop() : 뒤에 삭제 unshift() : 앞에 삽입 shift() : 앞에 삭제 * arr.splice(n, m) : 특정 요소 지움 // n : 시작, m : 개수 let arr = [1, 2, 3, 4, 5]; arr.splice(1,2); console.log(arr); // [1, 4, 5] * arr.splice(n, m , x) : 특정 요소 지우고 추가 let arr = [1, 2, 3, 4, 5] arr.splice(1, 3, 100, 200); console.log(arr); // [1, 100, 200, 5] let arr = ["나는", "철수", "입니다"]; arr.splice(1, 0, "대한민국", "소방관"); console.log(arr) /..