让前端飞web之路

【五】JavaScript对象:我们真的需要模拟类吗?

2019-02-13  本文已影响1人  alanwhy

首先,JS本身就是面向对象的,它并不需要模拟,只是JS实现面向对象的方式和主流的流派不太一样。

实际上,“基于类”并非面向对象的唯一形态,如果我们把视线从“类”移开,看看JS选择的原型系统,就是一个非常优秀的抽象对象的形式。

什么是原型?

原型是顺应人类自然思维的产物,用原型来描述对象的方法可以说是古已有之。

“基于类”的编程体长使用一个关注分类和类之间关系开发模型。这类语言中,总是先有类,再从类去实例化一个对象。类与类之间又可能会形成继承、组合等关系。

“基于原型”的编程更提倡程序员关注一系列对象实例的行为,之后再去关注如何将这些对象划分到最近的使用方式相似的原型对象。

原型系统的“复制操作”有两个实现思路:

JS的原型

可以概括为两条:

但是从ES6开始,JS提供了一系列内置函数,以便更为直接地访问操纵原型。三个方法分别是:

举个例子

var cat = {
    say(){
        console.log("meow~");
    },
    jump(){
        console.log("jump");
    }
}

var tiger = Object.create(cat,  {
    say:{
        writable:true,
        configurable:true,
        enumerable:true,
        value:function(){
            console.log("roar!");
        }
    }
})


var anotherCat = Object.create(cat);

anotherCat.say();

var anotherTiger = Object.create(tiger);

anotherTiger.say();

ES6中的类

推荐使用ES6的语法来定义类,而令function回归原本的函数语义。

ES6中引入class关键字,并且在标准中删除了所有class相关的私有属性描述,类的概念正式从属性升级成语言的基础设施

先看下类的基本写法:

class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
  // Getter
  get area() {
    return this.calcArea();
  }
  // Method
  calcArea() {
    return this.height * this.width;
  }
}

现有类语法中,getter/setter和method是兼容性最好的。
通过get/set关键字来创建getter,通过括号和大括号来创建方法,数据型成员最好写在构造器里面。

类的写法实际上也是由原型运行时来继承的,逻辑上JS认为每个类是有共同原型的一组对象,类中定义的方法和属性则会被写在原型对象上。

最重要的是,类提供了继承能力,举个例子:

class Animal { 
  constructor(name) {
    this.name = name;
  }
  
  speak() {
    console.log(this.name + ' makes a noise.');
  }
}

class Dog extends Animal {
  constructor(name) {
    super(name); // call the super class constructor and pass in the name parameter
  }

  speak() {
    console.log(this.name + ' barks.');
  }
}

let d = new Dog('Mitzie');
d.speak(); // Mitzie barks.

参考原文:JavaScript对象:我们真的需要模拟类吗?

上一篇下一篇

猜你喜欢

热点阅读