浅析js class

JavaScript014

浅析js class,第1张

在 ES6 规范中,引入了 class 的概念。使得 JS 开发者终于告别了,直接使用原型对象模仿面向对象中的类和类继承时代。

但是JS 中并没有一个真正的 class 原始类型, class 仅仅只是对原型对象运用语法糖。所以,只有理解如何使用原型对象实现类和类继承,才能真正地用好 class。

本质上js中class其实是构造函数的另一种写法,使之更加直观的展现构造器中的各项属性

基本使用

注意点:

(1)constructor是一个构造函数方法,创建对象时自动调用该方法

(2)constructor是类必须的一个属性,少了他类的创建会报错,如果我们不写的话js会给他自动加上

(3)this指的是实例化对象,就相当于构造函数中的this,指向的是当前创建的对象

(4)类中声明函数不需要function关键字,直接函数名即可

(5)方法之间不需要都好分割,加了会报错

因为本质上是构造函数的另一种写法,所以他的使用和一些其他特性都是和构造函数相似的。比如调用都是通过new关键字 并且class也存在prototype这个属性,通过她我们可以给这个类的原型对象定义属性。通过这个类创建出的对象一样会有这个属性

类的继承

子类继承基类后,同名的属性会覆盖掉基类,以上例子中两个类都有sayName函数,但是调用的时候输出的是子类的sayName。

一个构造函数可以使用 super 关键字来调用一个父类的构造函数。

同时类也支持get和set操作

所谓工厂函数,就是指这些内建函数都是类对象,当你调用他们时,实际上是创建了一个“类实例”。

我们首先通过new关键字创建了一个对象,obj就相当于Object的实例。我们通过类实例化了一个对象,然后给这个对象相应的属性,最后返回对象。我们可以通过调用这个函数来创建对象,这样的话,实际上工厂函数也很好理解了:

1,它是一个函数。

2,它用来创建对象。

3,它像工厂一样,“生产”出来的函数都是“标准件”(拥有同样的属性)

JavaScript项目有一个趋势,变得难以测试和重构,因为我们经常鼓励使用复杂的抽象层。原型和类实现一个简单的想法使用复杂和不人性的工具,如 new 和 this ,即使现在,这仍然引起各种各样的困惑,几年后他们被添加到语言。

function fun(){

var _this = this

//如果函数是用var定义的私有函数,如下

var func1 = function(){ }

//那么类中其他函数都可以直接通过func1()的形式调用

//如果函数是共有的,即用this定义,如下

this.func2 = function(){ }

/*则需要得到func对像的引用,即fun中的this(注意:是fun中的).

然而到了调用者函数(如下的caller)内部时,this指的是caller函数而不再是fun,所以可以考虑在fun中定义一个私有变量 var _this = this 来保证指向的是fun

*/

//例子:在this.caller中调用类中的其他函数

this.caller = function(){

func1()//私有函数直接调用

_this.func2()//公共函数,需要fun的this的指向

}

}