构造对象

我们可以抛开类,使用字面量来构造一个对象

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();

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

问题

这种方法解决了构造过程复杂,需要了解细节的问题,但是构造出来的对象类型都是Object,没有识别度

new

function Person(name) {
    this.name = name
    this.sayName = function() {
        console.log(this.name)
    }
}
var p = new Person('hunger')

以上代码的执行过程如下:

  1. 执行 new Person
    1. 创建一个空对象 {},假设名字是 tmpObj
    2. 执行 Person 函数,执行过程中对 this 操作就是对 tmpObj 进行操作
    3. 函数执行完后返回刚刚创建的 tmpObj
  2. 把 tmpObj 赋值给 p (p也指向同一个对象)

instanceof

instanceof是一个操作符,可以判断对象是否为某个类型的实例

p1 instanceof Person; // true
p1 instanceof Object;// true

instanceof判断的是对象

1 instanceof Number; // false

问题

构造函数在解决了上面所有问题,同时为实例带来了类型,但可以注意到每个实例printName方法实际上作用一样,但是每个实例要重复一遍,大量对象存在的时候是浪费内存

构造函数

  • 任何函数使用new表达式就是构造函数

  • 每个函数都自动添加一个名称为prototype属性,这是一个对象

  • 每个对象都有一个内部属性 __proto__(规范中没有指定这个名称,但是浏览器都这么实现的) 指向其类型的prototype属性,类的实例也是对象,其__proto__属性指向“类”的prototype

prototype

image

通过图示我们可以看出一些端倪,实例可以通过__prop__访问到其类型的prototype属性,这就意味着类的prototype对象可以作为一个公共容器,供所有实例访问。

抽象重复

我们刚才的问题可以通过这个手段解决

  • 所有实例都会通过原型链引用到类型的prototype

  • prototype相当于特定类型所有实例都可以访问到的一个公共容器

  • 重复的东西移动到公共容器里放一份就可以了

看下代码

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

终于有个靠谱的构建对象的方式了

results matching ""

    No results matching ""