본문 바로가기

javascript20

생성자 함수와 상속 개, 고양이처럼 type, name, sound (종류, 이름, 짖는 소리)에 따라 만들고 싶다면? function Animal(type, name, sound) { this.type = type; this.name = name; this.sound = sound; this.say = function() { console.log(this.sound); }; }; const dog1 = new Animal("개", "멍멍이", "멍멍"); dog1.say(); const dog2 = new Animal("개", "시바견", "머엉머엉"); dog2.say(); 공통으로 사용되는 say를 일반화 하고 싶다면? function Animal(type, name, sound) { this.type = type; .. 2020. 6. 27.
객체, 배열의 내장함수 정리 객체 내장함수 let obj = { name: 'bob', id : 1 } 를 기준으로 설명한다. 속성 이름으로만 이루어진 ["name" , "id"] 데이터를 얻고 싶다면? Object.keys(obj); 속성 값으로만 이루어진 ["bob", 1] 데이터를 얻고 싶다면? Object.values(obj); 속성별 배열로 이루어진 [["name", "bob"], ["id", 1]] 데이터를 얻고 싶다면? Object.entries(obj); 문자열에서 obj.name 값을 사용하고 싶다면? `my name is ${obj.name}` 배열 객체 내장함수 let arr = [1, 2, 3, 4, 5]; 를 기준으로 설명한다. 선언된 함수를 이용해 모든 배열 값을 출력하고 싶다면? function print.. 2020. 6. 27.
javascript 추가 기능 arrow function IE에서 지원하지 않는다. babel을 사용해서 ES5로 버전다운을 시켜주어야한다. 사용 방법은 ( parameter list ) => { function body } 와 같다. this를 사용할 수 없다. 구조 분해 할당 IE에서 지원하지 않는다. babel을 사용해서 ES5로 버전다운을 시켜주어야한다. 사용 방법은 { key1, key2} = obj; 와 같은 방식이다. switch switch 지원한다. getter, setter obj.property_name 을 사용할 수 있는데 해당 obj에 get property_name(){ } 이 정의되어 있다면 get에 해당하는 부분을 실행한다. 아래와 같이 사용 가능하다. let obj = { _name: "멍멍이", get.. 2020. 6. 27.
[Prototype] Prototype Chaining js에서는 클래스 개념이 없고 리터럴 방식이나 생성자로 객체를 생성한다. 이 때 생성된 객체의 부모가 무엇인지 파악해보자. 생성자 함수로 객체를 생성하는 경우 객체의 부모는 생성자 함수의 prototype속성이 참조하는 객체이다. 앞서 생성자 함수는 constructor가 있는 객체를 가리킨다고 한 것을 기억할 것이다. 리터럴로 객체를 생성하는 경우 var a = {} 와 같이 생성하면 내부적으로 Ojbect() 생성자 함수를 사용해 객체를 생성한다. 그리고 a의 부모는 Object 생성자 함수가 prototype속성으로 가리키는 객체이다. 모든 함수는 prototype속성이 있다. a.hasOwnProperty('name'); 이 때 위 코드를 실행할 수 있을까? 답은 그렇다. 왜냐하면 a의 부모인 O.. 2020. 6. 2.