OOP

72 阅读1分钟

Object.create()

const elfFcnStore = {
    attack(){
        return "attack with " + this.weapon;
    }
}
function createElf(name,weapon){
    let newElf = Object.create(elfFcnStore);
    newElf.name = name;
    newElf.weapon = weapon;
    return newElf;
}

Constructor Functions

function Charactor0(name, weapon) {
  this.name = name;
  this.weapon = weapon;
  //   this.attack = function(){
  //     return "attack with " + this.weapon;
  //   }
}
//1. every function has an attribute —— prototype,and is initialized as a empty object {}
//2. it is useless when the function is not a constructor
//3. we add methods that all instances of this constructor(function) use to the prototype object to aviod memories wasting 
Charactor0.prototype.attack = function () {
  return "attack with " + this.weapon;
};
Charactor0.prototype.build = function () {
  const self = this;
  function building(){
    return self.name + 'builds a house';
  }
  return building();
};//注意嵌套函数的this指向
const peter = new Charactor0("peter", "peterweapon");
console.log(peter.attack());//attack with peterweapon

ES6 Class

class Charactor {
  constructor(name, weapon) {
    this.name = name;
    this.weapon = weapon;
  }
  // methods
  attack() {
    return "attack with " + this.weapon;
  }
}
class Elf extends Charactor {
  constructor(name, weapon, type) {
    super(name, weapon);
    // console.log('before type added' , this)
    this.type = type;
    // console.log('after type added' , this)
  }
}
class Orge extends Charactor {
  constructor(name, weapon, color) {
    super(name, weapon);
    // console.log('before color added' , this)
    this.color = color;
    // console.log('before color added' , this)
  }
  makeFort() {
    return "a fort has been made";
  }
}
const fiona = new Elf("Fiona", "ninja stars", "house");
const dolby = new Orge("Dolby", "cloth", "green");

// console.log(fiona)
// console.log(fiona.attack())
// console.log(dolby.attack());
// console.log(dolby.makeFort())
console.log(Elf.__proto__ === Charactor);//true
console.log(fiona.__proto__ === Elf.prototype);//true
console.log(dolby.__proto__ === Orge.prototype);//true
console.log(Orge.prototype.__proto__ === Charactor.prototype);//true