Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
Tags
- 상속
- 글또10기
- set
- 이진탐색
- javascript
- Next.js
- mainapplication.kt
- supabase 페이지네이션
- map
- 스크롤이벤트
- reactnative
- app.post
- react
- array
- 슬라이딩윈도우
- 안드로이드빌드에러
- materialicons
- meatadata
- Filter
- 타입스크립트
- 리액트네이티브아이콘
- 페이지네이션
- app:compiledebugkotlin
- extends
- interface
- generic
- TS
- async
- 배열중복요소제거
- Spring
Archives
- Today
- Total
rhanziy
JS - 객체, 배열의 객체지향 문법 상속기능 class 본문
// 옛날방식 상속기능
const Student = function(name, age){
this.name = name,
this.age = age
}
Student.prototype.sayHi = function(){
console.log(`안녕 나는 ${this.name}이야`);
}
let 학생1 = new Student('Kim', 20);
학생1.sayHi();
var arr = [1,2,3];
var arr2 = [3,6,8,3,2,5,7];
Array.prototype.remove3 = function(){
for(let i = 0; i < this.length; i++){
if(this[i] == 3){
this.splice(i,1);
}
}
}
arr.remove3();
arr2.remove3();
console.log(arr);
console.log(arr2);
// ES5식 상속기능
var 부모 = { name: 'Kim', age : 50 };
var 자식 = Object.create(부모);
자식.age = 20;
var 손자 = Object.create(자식);
손자.age;
prototype 은 유전자라고 생각하면 편하다.
Array나 Object는 콘솔에 찍어보면 __proto__ 를 조회할 수 있는데,
여기에 기본 자바스크립트 내장함수가 들어있다.
물론 커스텀해서 등록 가능!
부모로부터 물려받은 데이터를 상속이라고 표현할 수 있음.
자식에 없는 값이 부모에 있다면 가까운 순차적으로 호출한다.
constructor(생성자)는 함수나 class로 만들 수 있다.
// ES6식 상속기능
class 부모 {
constructor(){
this.name = 'Kim';
// this.sayHi = function(){ console.log('hello'); }
}
sayHi(){
console.log('hello ' + this.name);
// contructor 밖에 생성하면 부모의 prototype에 추가됨
// 모든 자식이 공통적으로 사용 가능. 관리가 편함.
}
}
var 자식 = new 부모();
자식.__proto__ // 부모의 prototype출력
Object.getPrototypeOf(자식);
이건 ES6 문법. 상속을 왜하냐?
1. 오브젝트를 여러개 만들기 위해. 가독성도 좋고 관리도 쉬움.
2. 다음 글에
3. 추가
4. 함
'Html_css_js' 카테고리의 다른 글
JS - getter, setter로 데이터 다루기 (0) | 2022.12.22 |
---|---|
JS - 객체, 배열의 객체지향 문법 상속기능 class 2 (0) | 2022.12.22 |
JS - localStorage로 장바구니 기능 구현하기(+중복제거) (0) | 2022.11.10 |
JS - e.target.dataset 접근 + 제이쿼리 (0) | 2022.11.07 |
JS - id, pwd 유효성 검사 복습하다가 안됐던거. (0) | 2022.11.02 |
Comments