본문 바로가기
javascript/javascript 심화지식

상속, prototype

by honey.kikiki 2021. 7. 13.
728x90

상속, prototype;

const user = {
  name: "Mike",
};

user.name; // "Mike"

user.hasOwnProperty("name"); // true

user.hasOwnProperty("age"); // false

const user = {
  name: "Mike",
  hasOwnProperty: function () {
    console.log("haha");
  },
};

user.hasOwnProperty(); // "haha"

const car = {
  wheels: 4,
  drive() {
    console.log(drive);
  },
};

const bmw = {
  color: "red",
  navigation: 1,
};

const benz = {
  color: "black",
};

const audi = {
  color: "blue",
};

bmw.__proto__ = car;

benz.__proto__ = car;

audi.__proto__ = car;

 

car를 상속한다

const x5 = {
  color: "white",

  name: x5,
};

 

x5.__proto__ = bmw;

상속은 계속 이어질수있다.__proto__

car => bmw => x5 차례로 상속된다.

프러퍼티를 찾을떄는 아래에서 위로 올라가는 구조이다. x5 => bmw => car

prototype chain

 

for (const p in x5) {
  if (x5.hasOwnProperty(p)) {
    console.log("o", p);
  } else {
    console.log("x", p);
  }
}

o는 x5가 직접적으로 가지고 있는 property이고

x는 x5가 상속받은 property이다.

o color

o namex

x navigation

x wheels

x drive

 

 

 

위에 코드를 밑에 코드처럼 한번에 작성할수 있다.

 

Bmw.prototype = {
  constructor: Bmw,
  wheels : 4,
  drive = function(){
      console.log("drive..")
  },
  navigator : 1,
  stop = function(){
    console.log("stop..")
  },
}
const x5 = new Bmw("red");
const z4 = new Bmw("blue");

const x5.__proto__ = car;
const z4.__proto__ = car;




댓글