面向对象、原型、原型链入门

138 阅读1分钟

构造对象方式

  1. 字面量的方式
var obj1 = {
    nick: 'Byron',
    age: 20,
    printName: function(){
        console.log(obj1.nick);
    }
}
var obj2 = {
    nick: 'Casper',
    age: 25,
    printName: function(){
        console.log(obj2.nick);
    }
}

问题

  1. 太麻烦了,每次构建一个对象都是复制一遍代码
  2. 如果想个性化,只能通过手工赋值,使用者必需了解对象详细

用函数做自动化

function createObj(nick, age){
  var obj = {
      nick: nick,
      age: age,
      printName: function(){
            console.log(this.nick);
        }
  };
  return obj;
}

var obj3 = createObj('Byron', 30);
obj3.printName();

我们通过创建一个函数来实现自动创建对象的过程,至于个性化通过参数实现,开发者不必关注细节,只需要传入指定参数即可

new方式,构造函数

function Person(name) {
    this.name = name
    this.sayName = function() {
        console.log(this.name)
    }
}
var p = new Person('xu')
  • 创建一个空对象,把一个空的对象的 proto 属性设置为 People.prototype
  • 执行函数 People, 函数里面的 this 代表刚刚创建的新对象
  • 返回这个对象
    • 新生成了一个对象
    • 链接到原型
    • 绑定 this
    • 返回新对象
function Person(nick, age){
    this.nick = nick;
    this.age = age;
}
Person.prototype.sayName = function(){
    console.log(this.nick);
}

var p1 = new Person();
p1.sayName();

image.png