javascript 创建对象的7种模式
2015-07-30 11:37
615 查看
使用字面量方式创建一个 student 对象:
使用Object.defineProperties() 方法给对象添加属性:(只有IE9+,FF4+,SF5+,OP 12+,Chrome支持)
当面对使用Object构造函数和对象字面量创建单个对象时,我们会因为使用同一个接口创建很多对象,产生大量的重复代码。所以,有了创建对象的七种模式:
一、工厂模式(抽象了创建具体对象的过程)
二、构造函数模式
重写上面的例子:
与工厂模式相比,构造函数模式可以将它的实例标示为一种特定的类型。
三、原型模式
四、组合使用构造函数模式和原型模式(最常见的方式)
优点:构造函数模式用于定义实例属性,而原型模式用于定义方法和共享的属性,每个实例都会有自己的一份实例属性的副本,但同时又共享着对方法的引用,最大限度地节省了内存。
五、动态原型模式
优点:把所有信息都封装在了构造函数中,而通过在构造函数中初始化原型(仅在必要的情况下),同时还保持了构造函数和原型的优点。
注意:在使用动态原型模式时,不能使用对象字面量重写原型。
六、寄生构造函数模式
七、稳妥构造函数模式
稳妥对象:指的是没有公告属性,而且其方法也不引用this的对象。
与寄生构造函数模式类似,但存在两点不同:
1. 新创建对象的实例方法不用this
2. 不是要new 操作符调用构造函数
重写上面的例子:
可根据每个创建对象的模式来选择适合自己的方法,创建对象
(以上作为自己的个人笔记,参考来源于 javascript高级程序设计 第三版)
var student = function (){ name : "redjoy", age : 21, sex: women, sayName: function(){ alert(this.name); } };
使用Object.defineProperties() 方法给对象添加属性:(只有IE9+,FF4+,SF5+,OP 12+,Chrome支持)
var student = {}; Object.defineProperties( student,{ name:{ value: "redjoy" }, age:{ value: 21 }, _year:{ value:2015 }, year:{ get:function(){ return this._year; }, set:function(newValue){ if (newValue > 2015){ this._year = newValue; this.age += newValue -1993; } } } });
当面对使用Object构造函数和对象字面量创建单个对象时,我们会因为使用同一个接口创建很多对象,产生大量的重复代码。所以,有了创建对象的七种模式:
一、工厂模式(抽象了创建具体对象的过程)
function createStudent(name,age,sex){ var s = new Object(); s.name = name ; s.age = age ; s.sex = sex; s.sayName = function (){ console.log(this.name); }; return s; } var student1 = createStudent("redjoy",21,"women"); var student2 = createStudent("jonny",23,"man");
二、构造函数模式
重写上面的例子:
function Student( name,age,sex){ this.name = name; this.age = age; this.sex = sex; this.sayName = function() { console.log(this.name); }; } var student1 = new Student("redjoy",21,"women"); var student2 = new Student("jonny",23,"man");
与工厂模式相比,构造函数模式可以将它的实例标示为一种特定的类型。
三、原型模式
function Student(){ }//构造函数 Student.prototype = { name :"redjoy", age : 21, sex : "women", sayName : function(){ console.log(this.name); } }; var student1 = new Student(); var student2 = new Student();
四、组合使用构造函数模式和原型模式(最常见的方式)
优点:构造函数模式用于定义实例属性,而原型模式用于定义方法和共享的属性,每个实例都会有自己的一份实例属性的副本,但同时又共享着对方法的引用,最大限度地节省了内存。
function Student(name ,age ,sex ){ this.name = name ; this.age = age ; this.sex = sex; }//在构造函数里定义实例属性 Student.prototype = { constructor : Student, sayName : funtion(){ console.log(this.name); } }//在原型中定义constructor属性和sayName()方法 var student1 = new Student("redjoy",21,"women"); var student2 = new Student("jonny",23,"man"); console.log(student1.sayName === student2.sayName);//true
五、动态原型模式
优点:把所有信息都封装在了构造函数中,而通过在构造函数中初始化原型(仅在必要的情况下),同时还保持了构造函数和原型的优点。
function Student(name , age ,sex ){ //属性 this.name = name; this.age = age; this.sex = sex; //方法 if (typeof this.sayName != "function"){ Student.prototype.sayName = function(){ console.log(this.name); }; } } var student = new Student("redjoy",21,"women"); student.sayName();
注意:在使用动态原型模式时,不能使用对象字面量重写原型。
六、寄生构造函数模式
function Student(name , age,sex){ var s = new Object(); s.name = name; s.age = age; s.sex = sex; s.sayName = function(){ console.log(this.name); }; return s; } var student = new Student("redjoy",21,"women"); student.sayName();//"redjoy"
七、稳妥构造函数模式
稳妥对象:指的是没有公告属性,而且其方法也不引用this的对象。
与寄生构造函数模式类似,但存在两点不同:
1. 新创建对象的实例方法不用this
2. 不是要new 操作符调用构造函数
重写上面的例子:
function Student( name, age ,sex ){ //创建要返回的对象 var s = new Object(); //可以在这里定义私有变量和函数与上面类似 //添加方法 s.sayName = function(){ console.log(name); }; //返回对象 return s; }
可根据每个创建对象的模式来选择适合自己的方法,创建对象
(以上作为自己的个人笔记,参考来源于 javascript高级程序设计 第三版)
相关文章推荐
- JS preventDefault ,stopPropagation ,return false
- js 根据年月获取当月有多少天_js获取农历日期_及Js其它常用有用函数
- Javascript事件冒泡机制
- Js中判断一个值为null
- 用javascript写的加法运算的两种方法
- js代码实现随机颜色的小方块
- js代码验证手机号码和电话号码是否合法
- Ubuntu 安装 jsoncpp的全过程
- Jsp在Web.xml中的配置
- extjs Grid的表头要跟着需求刷新
- js插件收藏&&开发辅助工具
- jsp页面charset与head中charset的区别
- Javascript处理JSON数据格式
- JavaScript之基本介绍
- 用javascript预加载图片、css、js的方法研究
- js 对象深复制,创建对象和继承
- 使用velocity.js制作炫酷滚动效果页面
- javascript设计模式之对象工厂函数与构造函数详解
- json kit
- js