前言
类是面向对象编程语言最基础,最核心的概念,正因为有了类,才可以拓展延伸出具有相同的属性和函数的对象类
对象的特点,就是它可以拥有属性和方法,而在Es6之前,并没有提供类的支持,它是用构造函数来模拟类来实现的
那用Es5和Es6分别怎么实现一个类呢
01
ES5实现的类
代码语言：javascript复制// 用function 模拟一个类,同时也作为构造函数,首字母大写,用于区分普通函数
function MyClass() {
// 私有属性
this.name; // 类的成员变量name属性
// 私有方法,类的成员函数fun,每次实例化对象,都会重复创建对象,会造成内存空间的浪费,增加cpu开销
// 可以把私有的方法放到外面去
this.fun = function() {
alert("my functon name" this.name);
}
// 如下等价
//this.fun = fun
}
/**
* function fun() {
* alert("my functon name" this.name);
* }
*
*/
// 公有属性,利用原型对象可以解决实例化对象,避免重复创建构造函数内的方法创建
MyClass.prototype.outName = function() {
alert(this.name)
}
var obj = new MyClass(); // 使用new实例化一个类
obj.name = 'itclanCoder'; // 为成员变量赋值
obj.fun(); // 调用成员函数
obj.outName(); // itclanCoder以上是使用Es5的构造函数实现一个类,添加属性和方法,其中构造器函数内的自定义方法,可以抽离到外部,避免重复创建,可以提升性能
02
Es6实现类
具体代码如下所示
代码语言：javascript复制class MyClass {
// 通过construcor关键字来定义构造函数,添加了一个私有name属性
constructor(name) {
this.name = name;
this.fun = function() {
alert('my function name' this.name);
}
}
// 等价于上面的MyClass.prototype.outName,共有方法
outName() {
alert(this.name);
}
}
let obj = new MyClass('itclanCoder'); // 类可以传递参数
obj.fun();
obj.outName();对比
可以看出使用Es6中的类class创建自定义属性和方法,要简单和直观得多
自定义属性,放在constoructor构造器函数内,每一个类都会默认有这个constructor
分析
js中没有提供类的定义,但是提供new关键字,它的含义是返回一个实例化对象,并执行相应的函数的调用
本示例代码首先定义了一个函数MyClass,它类似java语言的构造函数,当使用new语句时,JS创建了一个对象,并执行该函数
该函数内部的this就指向刚刚创建的对象,这样就实现了面向对象语言中类的定义和使用
当然在Es6中提供了class定义类的,这样更加方便的
