作者: 她不美却常驻我心
博客地址: https://blog.csdn.net/qq_39506551
微信公众号:老王的前端分享
每篇文章纯属个人经验观点,如有错误疏漏欢迎指正。转载请附带作者信息及出处。
从零开始学前端 - 22. JS类的概念及六种定义方式
类的基本概念
首先我们要先来理解一下什么是类?
类是对某一类具有共同特征的事物的抽象。在代码中我们可以将类看做是拥有相等功能和属性的集合。
什么是类的实例?
实例就是类的对象。也就是根据类创建出来的一个个具体的对象,每个实例对象拥有相同的属性和方法,只是值不同。
接下来我们通过现实生活中的事物来举例理解一下:
我们可以将所有的人类看作是一个 Human
类,那其中的某一个人,如 小明
,小红
就是 Human
类中的实例对象。
如果将所有的动物看作是一个 Animal
类,那某一种动物,如 狗
,猫
,鸟
就是 Animal
类中的实例对象。
我们也同样可以将动物 狗
看作是一个 Dog
类,那么对 狗
这个类而言,哈士奇
,金毛
,吉娃娃
就是具体的对象。
定义类的方法
首先我们要先明确一点,JS 并不是真正的面向对象语言,其中并没有类的概念,ES6 新增的 Class
关键字,也只不过是一个语法糖而已,我们是通过原型链和继承等思想来将类模拟出来的。
构造函数 + 原型链
定义类的方式有很多,但我们一般采用 构造函数 + 原型链
来实现一个类,为什么不推荐单纯使用构造函数的原因请查看上篇文章中:构造函数的缺点
function Animal(name, sex){
this.name = name;
this.sex = sex;
}
Animal.prototype.sayName = function(){
alert(this.name);
}
var human = new Animal("小明", "男");
同时我们可以使用对象的内置方法来对类进行相关的设置来实现静态类等的实现:
- 设置类为只读:
function Human(name, sex) {
var props = {
name: {
value: name, enumerable: true, configurable: false, writable: false },
sex: {
value: sex, enumerable: true, configurable: false, writable: false },
}
if (this instanceof Human) {
Object.defineProperties(this, props);