JavaScript精炼---类(class)、构造函数(constructor)、原型(proto

zzbo 发布于2019-08-26 10:10 / 2674人阅读

摘要：在讨论构造器和原型方法前，我可以看看一种叫做工厂方式的仿造方法。因此，出现了构造函数方式，它的关键在于构造器概念的引入。

类 Class
类的概念应该是面向对象语言的一个特色，但是JavaScript并不像Java，C++等高级语言那样拥有正式的类，而是多数通过构造器以及原型方式来仿造实现。在讨论构造器和原型方法前，我可以看看一种叫做“工厂方式”的仿造方法。

function start() {

   alert("Bang!!");

}


function createCar(color, title) {

   var car = {};

   car.color = color;

   car.title = title;

   car.start = start;

   return car;

}

 

var car1 = createCar("red", "BMW");

var car2 = createCar("yellow", "VOIS");

这种方式显然可以实现class的功能，但是外形上怎么也无法说它是个class以及class实例的创建过程。因此，出现了“构造函数方式”，它的关键在于构造器（Constructor）概念的引入。

构造器 Constructor
加粗文字
我们先来看“构造函数方式”的具体做法：

function start(){

   alert("Bang!!!");

}

 

//constructor

function Car(color, title){

   this.color = color;

   this.title = title;

   this.start = start;

}

 

var car1 = new Car("red", "BMW");

var car2 = new Car("yellow", "VOIS");

这个看起来有点类的样子了吧（先不提那个难看的外置function）？我们发现，那个constructor其实就是一个简单的function，它与“工厂方式”中的createCar()区别就在于：1、方法名大写 2、没有了空对象的创建和返回 3、使用this做引用。那原来的那个空对象的创建以及返回的步骤去哪了呢？这两个步骤，现在都由创建实例时的“new”实现了。“new”这个操作符负责创建一个空对象，然后将那个叫做构造器的function添加到实例对象中并触发它，这样这个function实际上就是这个对象的一个method，function中的this指向的便是这个对象，最后将这个对象返回。根据如上分析，我们可以把这个过程简单分解为如下代码：

var obj = {};

obj.constructor = Car;

obj.constructor("red", "BMW");  //”this“ refers to obj

return obj;

云服务器 GPU云服务器父类构造函数 php类构造函数 javascript原型 java中class类

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/105706.html

JavaScript继承理解：ES5继承方式+ES6Class继承对比

摘要：寄生组合式继承的继承方式有多种主要有原型链继承借用构造函数组合式继承寄生式继承和寄生组合式继承。中利用定义类，实现类的继承子类里调用父类构造函数实现实例属性和方法的继承子类原型继承父类原型，实现原型对象上方法的继承。 JavaScript中实现继承在JavaScript中实现继承主要实现以下两方面的属性和方法的继承，这两方面相互互补，既有共享的属性和方法，又有特有的属性和方法。 ...

liaoyg8023 2019-08-26 12:09 评论0 收藏0
javascript的面向对象，原型链及继承

摘要：也就是说，不必在构造函数中添加定义对象信息，而是可以直接将这些信息添加到原型中。子类的属性，表示构造函数的继承，总是指向父类。以前，这些原生构造函数是无法继承的。面向对象 js是一门基于对象的语言。js中的一切皆对象; console.log(Object.prototype.toString.call(123)) //[object Number] console....

Xufc 2019-08-22 14:00 评论0 收藏0
JavaScript 五十问——从源码分析 ES6 Class 的实现机制

摘要：防止类的构造函数以普通函数的方式调用。这个函数的主要作用是通过给类添加方法，其中将静态方法添加到构造函数上，将非静态的方法添加到构造函数的原型对象上。 Class是ES6中新加入的继承机制，实际是Javascript关于原型继承机制的语法糖，本质上是对原型继承的封装。本文将会讨论：1、ES6 class的实现细2、相关Object API盘点3、Javascript中的继承实现方案盘点...

LeexMuller 2019-08-23 14:38 评论0 收藏0
Javascript面向对象与继承

摘要：众所周知，是一门面向对象的语言，如果说针对面向对象来发问的话，我会想到两个问题，在中，类与实例对象是如何创建的，类与实例对象又是如何实现继承的。但是在中是指向的，因为每一个构造函数其实都是这个对象构造的，中子类的指向父类可以实现属性的继承。众所周知，Javascript是一门面向对象的语言，如果说针对面向对象来发问的话，我会想到两个问题，在js中，类与实例对象是如何创建的，类与实例对...

pcChao 2019-08-22 16:02 评论0 收藏0
ES6中class的使用

摘要：如果不指定一个构造函数方法则使用一个默认的构造函数。一个类中出现多次构造函数方法将会抛出一个错误。四关键字作为函数时，指向父类的构造函数。五类的属性和属性作为构造函数的语法糖，同时有属性和属性，因此同时存在两条继承链。一、class的定义与基本用法 1.class的定义 ECMAScript 2015 中引入的 JavaScript 类实质上是 JavaScript 现有的基于原型的...

用户84 2019-08-23 18:34 评论0 收藏0