我们知道javascript中没有像java那样的类和对象,但是它也可以实现一些对象功能。现在分别介绍javascript中五种创建对象的方法并介绍各自利弊。
1.工厂模式
利用javascript的Object对象方法创建优点是可以用构造方法创造很多对象,缺点是不能判断对象的所属“类”
function createUser(name,age){
var o = new Object();
o.name = name;
o.age = age;
o.sayName = function(){
return this.name;
};
return o;
}
var u1 = createUser("tom",23);
alert(u1 instanceof User);//缺点不知道对象类型 User undefined
2.构造函数模式化
类似于构造方法,可以用new进行创建对象;缺点是对象的方法被创建多次,占用内存大
function User(name,age){
this.name = name;
this.age = age;
this.sayName = function(){
alert(this.name);
}
}
var u1 = new User("alice",22);
var u2 = new User("tom",23);
alert(u1 instanceof User);//true // 可以判断u1 是属于User“类”
//缺点 对象的方法被创建多次
alert(u1.sayName == u2.sayName) //false 可以判定u1和u2的sayName 不相等
3.原型模式
利用javascript的prototype属性创建对象;克服了构造函数的缺点,却失去了构造函数方法的优点,即不能在new 的时候传递对象属性值;
还有一个致命缺点,那就是:属性引用对象类型时候会发生共享问题
function User(){};
User.prototype.name = "";
User.prototype.age = 0;
User.prototype.address = [];
User.prototype.sayName = function(){
alert(this.name);
}
var u1 = new User();
var u2 = new User();
alert(u1 instanceof User);//true
alert(u1.sayName == u2.sayName) //true
u1.name = "tom";
u1.sayName();
//缺点 1.不能具有构造函数 2.属性引用对象类型时候会发生共享问题(致命缺点)
u1.address.push("河南");
alert(u1.address);//河南
alert(u2.address);//河南 u2并没有对address赋值,却读取到了u1的值
4 混合模式
混合了构造方法和原型模式,构造方法用来创建对象属性,原型模式用来创建对象方法
function User(name,age){
this.name = name;
this.age = age;
this.address = [];
}
User.prototype.sayName = function(){
alert(this.name);
}
var u1 = new User("alice",22);
var u2 = new User("tom",23);
alert(u1 instanceof User);//true
//对象的方法不会被创建多次
alert(u1.sayName == u2.sayName) //true
u1.address.push("河南");
u2.address.push("江西");
alert(u1.address);
alert(u2.address); //两个对象的爱address属性不会混淆
//比较完美了,最大的问题是方法写在对象外面了,不够优雅
5 动态原型模式
在混合模式上做出修改,更加优雅,把对象方法写在构造方法内部;可以
function User(name,age){
this.name = name;
this.age = age;
this.address = [];
//也可以理解为单例模式,防止后来创建的对象把之前的对象方法覆盖
if(typeof this.sayName != "function"){
User.prototype.sayName = function(){
alert(this.name);
}
}
}
var u1 = new User("alice",22);
var u2 = new User("tom",23);
alert(u1 instanceof User);//true
alert(u1.sayName == u2.sayName) //true
//可以认为是最好的状态
相关推荐
NULL 博文链接:https://redhacker.iteye.com/blog/1457293
JavaScript对象创建的九种方式
NULL 博文链接:https://yueyemaitian.iteye.com/blog/781915
javascript面向对象创建对象的方式小结.docx
javascript创建对象、对象继承的有用方式详解_.docx
NULL 博文链接:https://redhacker.iteye.com/blog/1458580
第一种创建对象的方式: 创建JSON对象 推荐使用的场合: 作为函数的参数,临时只用一次的场景。比如设置函数原型对象。 var object = { name: "Eric", age: 24, sayHi: function(){ console.log("My name is ...
javascript对象创建方法总结,通过这些方法的总结,可以对对象有了更深一步的了解,也加深了对对象的巩固认识。
NULL 博文链接:https://redhacker.iteye.com/blog/1457020
文章《javascript对象创建--类、继承》源码
详解js创建对象的几种方式和对象方法 这篇文章是看js红宝书第8章,记的关于对象的笔记(第二篇)。 创建对象的几种模式: 工厂是函数的意思。工厂模式核心是定义一个返回全新对象的函数。 function getObj...
本篇文章主要介绍了JavaScript创建对象的多种方式以及优缺点,主要介绍了5种方式,有兴趣的可以了解下
NULL 博文链接:https://kejiangwei.iteye.com/blog/429632
以下几种,是javascript中最常用的创建对象的方式。初学者看到后,可能会晕掉,甚至会觉得担心。其实完全不用担心,这些种方式,只需要掌握一两种,对其他的几种只需要理解就好了
JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以创建单个对象,显然这两种方式会产生大量的重复代码,并不适合量产。接下来介绍七种非常经典的创建对象的方式,他们也各有优缺点 工厂...
本文实例讲述了JavaScript创建对象的常用方式。分享给大家供大家参考,具体如下: JS中没有类的概念,那么怎么创建对象呢?下面一一来细说! 传统的创建对象的方式: 1、创建Object的实例 var person = new Object...
JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以创建单个对象,显然这两种方式会产生大量的重复代码,并不适合量产。接下来介绍七种非常经典的创建对象的方式,他们也各有优缺点。 ...
本文实例讲述了JavaScript面向对象程序设计创建对象的方法。分享给大家供大家参考,具体如下: 面向对象的语言具有一个共同的标志,那就是具有“类”的概念,但是在javascript中没有类的概念,在js中将对象定义为...
主要为大家介绍了创建对象的9种方式,帮助大家更好地学习javascript面向对象,感兴趣的小伙伴们可以参考一下