본문 바로가기

Programming Language32

JS33 - 19.map, reduce, filter 왜 써야하나요? 코드 간결성 함수형 프로그래밍! for, forEach 루프 관리 안해도 된다! Array.prototype에 정의되어 있으므로 어떤 배열에서도 사용할 수 있다!! map() map() 메소드는 배열의 모든 요소에 제공된 함수를 적용하여, 결과로 새 배열을 생성한다. map에 전달한 콜백은 명시적으로return 문을 가져야한다. 그렇지 않으면map은undefined로 가득 찬 배열을 출력합니다. 콜백 인자 param meaning elem 요소 값 index 각 순회의 인덱스는 왼쪽에서 오른쪽으로 이동 array 메소드를 호출 한 원래의 배열 thisArg (선택 사항) 콜백에서 this로 참조 될 객체 array.map(function(elem, index, array) { ... },.. 2021. 6. 3.
JS 33 - 18.Object.create와 Object.assign, js에서 객체 복사하기 Object.create ECMAScript 5의 기능, IE8 이하 버전 사용 불가 프로토타입 체인만 연결한다고 보면 될 듯 // 1 const original = { a: 1, b: 2, c: { d: 3 } }; // 2 const copied = Object.create(original); // 복사가 아니다! console.log(original.isPrototypeOf(copied)); //true // 3 original.a = 1000; original.c.d = 3000; console.log(copied.a);// 1000 console.log(copied.c.d);// 3000 // 4 console.log(copied);// {} // 5 original.hasOwnProperty(.. 2021. 6. 3.
JS33 - 17.프로토타입의 상속과 체인 prototype vs Prototype prototype (속성) - 특정 객체의 prototype 객체: JavaScript로 작성한 모든 기능의 속성으로 지정된 특수 객체입니다. 여기서 분명히 설명 하겠지만, JavaScript가 제공하는 내부 함수 (+ bind에 의해 반환 된 함수)에는 필수 항목이 아닌 모든 함수에 대해 이미 존재합니다. 이prototype은 (new 키워드를 사용하여) 그 함수에서 새로 생성 된 객체의[[Prototype]](아래 참조)이 가리키는 것과 동일한 객체입니다. [[Prototype]] (링크속성) - 생성자 함수의 prototype 프로퍼티가 가리키는 prototype 객체: 이것은 객체에서 읽혀지는 일부 속성을 사용할 수 없는 경우 실행 중인 컨텍스트가 액세스하.. 2021. 6. 3.
JS33 - 16.new, 생성자, instanceof, 인스턴스 new 생성자 함수 (Constructor function)을 호출하는 방법이다. 이름은 대문자로 시작한다. new 신규작성 시, 새로운 빈 오브젝트를 생성한다. 새로 생성된 오브젝트에 this를 바인딩한다. 새로 생성된 오브젝트에 생성자 함수의 prototype object를 가리키는 proto라는 속성을 추가한다. 생성된 오브젝트가 함수로부터 반환될 수 있도록 함수의 마지막에 return this를 추가한다. (function에서 object를 반환) function Student(name, age) { this.name = name; this.age = age; } var second = new Student('Jeff', 50); second.__proto__ === Student.prototyp.. 2021. 6. 3.
JS33 - 15.this, call, apply, bind call,apply,bind: 함수 호출을 제어하는데 사용된다. call()/apply()를 사용하여 함수를 즉시 호출할 수 있다. bind()는 나중에 실행될 때 원래의 함수를 호출하는 올바른 컨텍스트(“this“)를 갖는 바인딩 함수를 반환한다. 그래서 bind()는 함수가 특정 이벤트에서 나중에 호출되어야 할 경우에 유용하게 사용할 수 있다. this 함수가 생성될 때 this 키워드가 함께 생성되고, 함수가 작동하는 object와 연결된다. this 키워드의 값은 함수 그 자체와는 아무 관련이 없다. 함수가 호출되는 방식이 this값을 결정한다. // define a function var myFunction = function () { console.log(this); }; // call it .. 2021. 6. 3.
JS33 - 14.팩토리와 클래스 Javascript의 클래스란? JavaScript는 프로토타입 기반 언어이며, JavaScript의 모든 객체에는 [[Prototype]]이라는 숨겨진 내부 속성이 있어 객체 특성 및 메서드를 확장하는 데 사용할 수 있습니다. 자바스크립트에는 클래스라는 개념이 없다. 대신 프로토타입(Prototype)이라는 것이 존재한다. 자바스크립트가 프로토타입 기반 언어라고 불리는 이유이다. 클래스가 없으니 기본적으로 상속기능도 없다. 그래서 보통 프로토타입을 기반으로 상속을 흉내내도록 구현해 사용한다. 참고로 최근의 ECMA6 표준에서는 Class 문법이 추가되었다. 하지만 문법이 추가되었다는 것이지, 자바스크립트가 클래스 기반으로 바뀌었다는 것은 아니다. 클래스를 통해 객체를 보다 간결하게 작성할 수 있으며, .. 2021. 6. 3.