Javascript의 프로토타입과 프로토타입 상속

원기


프로토타입은 JavaScript에서 기본적으로 모든 기능 및 개체와 연결되는 개체입니다.

함수, 객체 또는 배열을 만들 때마다 javacript는 기본적으로 내부에 몇 가지 추가 메서드가 포함된 프로토타입 객체를 첨부합니다.



모든 JavaScript 개체는 프로토타입에서 속성과 메서드를 상속합니다.

날짜 개체는 Date.prototype에서 상속됩니다.

배열 객체는 Array.prototype에서 상속됩니다.

플레이어 개체는 Player.prototype에서 상속됩니다.

Object.prototype은 프로토타입 상속 위에 있습니다.
체인. 날짜 개체, 배열 개체 및 플레이어 개체 모두
Object.prototype에서 상속합니다.
프로토타입 체인
프로토타입 상속은 프로토타입 체인 개념을 사용합니다.

생성된 모든 개체에는 다른 개체 또는 null을 가리키는 [[Prototype]]이 포함됩니다.

예:- 객체 B를 가리키는 [[Prototype]] 속성을 가진 객체 C. 객체 B의 [[Prototype]] 속성은 프로토타입 객체 A를 가리킵니다. 이것은 계속해서 프로토타입 체인이라고 하는 일종의 체인을 형성합니다.
프로토타입 상속

let animal = {
  eats: true
   walk() {
    console.log("Animal walk");
  }
};

let rabbit = {
  jumps: true
  __proto__ = animal;
};


// we can find both properties in rabbit now:
console.log(rabbit.eats ); // true

rabbit.walk(); // Animal walk

const obj = {
  firstName: "Neeraj",
  lastName: "Kumar",
  getFullName: function () {
    return this.firstName + " " + this.lastName;
  }
};

const obj2 = {
  firstName: "Er Neeraj",
  __proto__: obj
};

console.log(obj2.getFullName()); //Er Neeraj Kumar

나만의 프로토타입 만들기
바인드 방법에 대한 Ployfill 만들기

const obj = {
  firstName: "Neeraj",
  lastName: "Kumar"
};

function getFullName(state) {
  return this.firstName + " " + this.lastName + " " + state;
}

const fName = getFullName.bind(obj, "Yadav");
console.log(fName()); //Neeraj Kumar Yadav

Function.prototype.myBind = function (...args) {
  const func = this;
  const params = args.slice(1);
  return function () {
    return func.apply(args[0], params);
  };
};

const fName2 = getFullName.myBind(obj, "Roy");
console.log(fName2()); //Neeraj Kumar Roy

호출, 적용 및 바인드 방법에 대한 Ployfill 만들기

const obj = {
  firstName: "Neeraj",
  lastName: "Kumar"
};

function getFullName(state) {
  return this.firstName + " " + this.lastName + " " + state;
}

Function.prototype.myBind = function (obj, ...args) {
  obj.func = this;
  return () => {
    return obj.func(...args);
  };
};

Function.prototype.myCall = function (obj, ...args) {
  obj.func = this;
  return obj.func(...args);
};

Function.prototype.myApply = function (obj, args) {
  obj.func = this;
  return obj.func(...args);
};

const fName2 = getFullName.myBind(obj, "Yadav");
console.log(fName2()); //Neeraj Kumar Yadav

console.log(getFullName.myCall(obj, "Roy"));  //Neeraj Kumar Roy

console.log(getFullName.myApply(obj, ["Sonu"]));  //Neeraj Kumar Sonu