这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
这篇文章主要介绍了 JS 常见创建类的方法, 结合实例形式总结分析了工厂方式, 构造器方式, 原型方式, 联合方式等常见的 javascript 创建类的常用技巧与相关注意事项, 需要的朋友可以参考下
本文实例讲述了 JS 常见创建类的方法。分享给大家供大家参考,具体如下:
Javascript 是一种基于对象的语言,你遇到的所有东西几乎都是对象。但是,它又不是一种真正的面向对象编程(OOP)语言,因为它的语法中没有 Class。(不过,ES6 引入了 Class 这个概念,作为对象的模板。通过 class 关键字,可以定义类。ES6 入门:http://es6.ruanyifeng.com/)。
但是在项目开发中,经常用到 JS 面向对象开发,这就需要我们去用 JS 创建类,从而去实例化一些对象。接下来我们介绍一下在 JS 中创建类的几种方式:
1. 工厂方式:
- //通过工厂方式创建对象,先定义一个工厂方法
- function createObj(){
- var obj = new Object();
- obj.name="xxx";
- obj.say=function(){
- alert("我是xxx");
- }
- return obj;
- }
- //调用工厂方法创建对象:
- var obj1 = createObj();
- //也可以用这种形式
- function createObj(){
- var obj = {}; //这样生成对象
- obj.name="xxx";
- obj.say=function(){
- alert("我是xxx");
- }
- return obj;
- }
- var obj1 = createObj();
这种方式的问题是每一次通过工厂方法去创建一个对象,这个对象的属性 name 和方法 say 都必须重新创建一次,浪费内存。
2. 构造器方式:
- //创建一个构造器,构造函数首字母大写
- function Obj(){
- this.name="xxx";
- this.say=function(){
- alert("我是xxx");
- };
- }
- //利用构造器,通过new关键字生成对象
- var obj1=new Obj();
这是最基本的方式, 但是也存在和工厂方式一样的毛病。
3. 原型方式:
- //用空函数创建一个类
- function Obj(){
- }
- //在类的原型链上添加属性和方法
- Obj.prototype.name="xxx";
- Obj.prototype.say=function(){
- alert("我是xxx");
- }
- //生成对象
- var obj1=new Obj();
这个方式的缺点是,当有引用属性时,改变一个对象的这个属性也会改变其他对象的这个属性。因为一个引用属性,都是指向的同一个地方。
4. 原型 / 构造联合方式
- //用构造函数定义对象的非函数属性
- function Obj(name){
- this.name=name;
- this.arr=new Array('a','b');
- }
- //用原型方式定义对象的方法
- Obj.prototype.say=function(){
- alert("我是xxx");
- }
- //生成对象
- var obj1 = new Obj('xxx');
这种是目前用的最多的创建类和对象的方式,将方法和属性用不同的方式封装。
5. 动态原型方式
- //动态原型方式和原型/构造混合方式的原理相似,唯一的区别就是赋予对象方法的位置
- function Person(name, sex) {
- this.name = name;
- this.sex = sex;
- if (typeof this.say != "function") {
- Person.prototype.say = function () {
- alert(this.name);
- }
- }
- }
- var man =new Person ("凯撒", "男");
- man.say();//凯撒
动态原型模式是将所有的信息都封装到构造函数中,构造函数中,只用 say 不存在的情况下,才会将它添加到原型中。这段代码只有在初次调用时才会执行。
实例化 obj 对象有三步:
1. 创建 obj 对象:
- obj=new Object();
2. 将 obj 的内部__proto__指向构造他的函数 Obj 的 prototype,同时,obj.constructor===Obj.prototype.constructor,从而使得 obj.constructor.prototype 指向 Obj.prototype(obj.constructor.prototype===A.prototype)。obj.constructor.prototype 与的内部_proto_是两码事,实例化对象时用的是_proto_,obj 是没有 prototype 属性的,但是有内部的__proto__,通过__proto__来取得原型链上的原型属性和原型方法。
3. 将 obj 作为 this 去调用构造函数 Obj,从而设置成员(即对象属性和对象方法)并初始化。
当这 3 步完成,这个 obj 对象就与构造函数 Obj 再无联系,这个时候即使构造函数 Obj 再加任何成员,都不再影响已经实例化的 obj 对象了。
希望本文所述对大家 Javascript 程序设计有所帮助。
来源: http://www.phperz.com/article/17/0522/332576.html