最常用的JavaScript类的定义

Posted 2021-01-10 ourener

混合的构造函数/原型方式

联合使用构造函数和原型方式，就可像用其他程序设计语言一样创建对象。这种概念非常简单，即用构造函数定义对象的所有非函数属性，用原型方式定义对象的函数属性（方法）。结果是，所有函数都只创建一次，而每个对象都具有自己的对象属性实例。

function Huster(name,age,college)
{
　　this.name = name;
　　this.age = age;
　　this.college = college;
　　this.course = new Array();
}
Huster.prototype.addCourse = function(course)
{
　　this.course.push(course);
};

huster1 = new Huster(‘偶人儿‘,23,‘自动化‘);
huster2 = new Huster(‘why‘,22,‘自动化‘);

huster1.addCourse(‘logistics‘);
huster2.addCourse(‘Chinese‘);
alert(huster1.course);
alert(huster2.course);

所有的非函数属性都在构造函数中创建，意味着能够用构造函数的参数赋予属性默认值了。因为只创建 addCourse() 函数的一个实例，所以没有内存浪费。此外，给 huster1 的 course 数组添加 ‘logistics‘ 值，不会影响到 huster2 的数组。又因为使用了原型方式，所以仍然能利用 instanceof 运算符来判断对象的类型。这种定义类的方式是 ECMAScript 采用的主要方式，它具有其他方式（单独的构造函数方式和原型方式）的特性，却没有他们的副作用。

动态原型方法

对于习惯使用其他语言的开发者来说，使用混合的构造函数/原型方式感觉不那么和谐。毕竟，定义类时，大多数面向对象语言都对属性和方法进行了视觉上的封装。动态原型方法的基本想法与混合的构造函数/原型方式相同，即在构造函数内定义非函数属性，而函数属性则利用原型属性定义。唯一的区别是赋予对象方法的位置。下面是用动态原型方法重写的 huster 类：

function Huster(name,age,college)
{
     this.name = name;
     this.age = age;
     this.college = college;
     this.course = new Array();    
     
     if (typeof Huster._initialized == "undefined") 
     {
        Huster.prototype.addCourse = function(course)
        {
            this.course.push(course);
        };    
        Huster._initialized = true;
     }
 }   
 huster1 = new Huster(‘偶人儿‘,23,‘自动化‘);
 huster2 = new Huster(‘why‘,22,‘自动化‘);
 
 huster1.addCourse(‘logistics‘);
 huster2.addCourse(‘Chinese‘);
 alert(huster1.course);
 alert(huster2.course);

直到检查 typeof Huster._initialized 是否等于 "undefined" 之前，这个构造函数都未发生变化。这行代码是动态原型方法中最重要的部分。如果这个值未定义，构造函数将用原型方式继续定义对象的方法，然后把 Huster._initialized 设置为 true。如果这个值定义了（它的值为 true 时，typeof 的值为 Boolean），那么就不再创建该方法。简而言之，该方法使用标志（_initialized）来判断是否已给原型赋予了任何方法。该方法只创建并赋值一次，这使得这段代码看起来更像其他语言中的类定义了。

参考w3school的js教程：http://www.w3school.com.cn/js/pro_js_object_defining.asp