华山资源网

JS常见创建类的方法小结【工厂方式,构造器方式,原型方式,联合方式等】
网络编程 2024/11/18 佚名
3 1

本文实例讲述了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相关内容感兴趣的读者可查看本站专题：《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

华山资源网 Design By www.eoogi.com
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
华山资源网 Design By www.eoogi.com
www.eoogi.com 华山资源网
120,135影音资源
344,641技术资源
22,817软件资源
435,032站长资源

更新日志

友情链接

杰晶网络 DDR爱好者之家 桃源资源网 杰网资源 富贵资源网 南强小屋 铁雪资源网 幽灵资源网 万梅资源网 狼山资源网 白云岛资源网 昆仑资源网 相思资源网 明霞山资源网 内蒙古资源网 黑松山资源网 茶园资源网 饿虎岗资源网 大旗谷资源网 常春岛资源网 岱庙资源网 兴国资源网 快活林资源网 蝙蝠岛资源网 帝王谷资源网 白云城资源网 伏龙阁资源网 清风细雨楼 天枫庄资源网 圆月山庄资源网 无争山庄资源网 神水资源网 移花宫资源网 神剑山庄资源网 无为清净楼资源网 金钱帮资源网 丐帮资源网 华山资源网 极乐门资源网 小李飞刀资源网 凤求凰客栈 风云阁资源网 金狮镖局 鸳鸯亭资源网 千金楼资源网 更多链接
华山资源网 Design By www.eoogi.com