方法一
var o=new Object();
o.age=20;
o.name="lisa";
o.showName=function(){
console.log(this.name);
}
这种写法创建了一个对象o 给o添加属性和方法,看似没有问题但是在创建多个o 就需要重复的给o添加属性,所以这种写法是较为不通用的一种写法,
方法二
很多人想到干脆用工厂创建o 就可以解决o无法重复创建问题代码如下
function createPerson(age,name){
var o=new Object();
o.age=age;
o.name=name;
o.showName=function(){
console.log(this.name);
}
return o;
}
这样解决了重复创建对象的问题,通过createPerson 这个工厂就可以创建多个不同的对象,每个都有不同age属性,不同name属性,但是showName在每个创建对象的时候也会穿件一个新的方法模板,是不是有点浪费内存
所有就有以下的改造方法把showName单独提取出来代码如下
function createPerson(age,name){
var o=new Object();
o.age=age;
o.name=name;
o.showName =showName;
return o;
}
function showName(){
console.log(this.name);
}
如此这番的改造就解决showName方法多次创建的问题,也节约了内存,是不是很奇怪,感觉写习惯面向对象代码的人看着这些是不是非常不习惯的。
方法三
通过构造方法构建对象代码如下
function Person(age,name){
this.age=age;
this.name=name;
this.showName=function(){
console.log(this.age);
}
}
var p1=new Person(12,"lisa");
var p2=new Person(15,"lee");
观察以上代码区别,这个person 中是没有new Object() 和返回值的,所有Person 就是一个构造器,用来构造Person对象这种写法同样是没有解决showName多次创建的问题,解决方法也是跟上边是一样的只有提取出showName方法
方法四
通过prototype属性构建对象代码如下
function Person(){}
Person.prototype.age=12;
Person.prototype.name="lee";
Person.prototype.pArray=new Array();
Person.prototype.showName=function(){
console.log(this.name);
};
var p1=new Person();
p1.pArray.push("sa");
var p2=new Person();
console.log(p1.showName===p2.showName);//true
console.log(p1.pArray[0]);//sa
console.log(p2.pArray[0]);//sa
了解prototype属性就应该知道每个创建的person对象都会自动拥有age name 属性和showName 方法而且 这种写法有一个好处就是解决了showName重复创建的问题,但是两个新问题也随之而来,无法使用构造器传递参数,如Person(23,"sa"),更要命的是如果属性是引用类型的所有创建的对象都会持有同一个引用 所以就导致了 pArray 值都是一样,如何解决这个问题?
方法五
混合模式 prototype +构造器同时创建对象代码如下
function Perosn(age,name){
this.age=age;
this.name=name;
this.array=new Array();
}
Person.prototype.showName=function(){
console.log(this.name);
}
如此这般就同时规避了以上的两个问题。而且可以用instanceof 得知对象。
方法六
方法五其实已经没有硬伤了,但是开发者会感觉代码不够优美,所以就诞生了动态原型方法,代码如下
function Person(age,name){
this.age=age;
this.name=name;
if(typeof Person._initialized=='undefined'){
Person.prototype.showName=function(){
console.log(this.name);
}
Person._initialized=true;
}
}
开发者经过大量的实践在js面向对象编程中发现的比较科学的方法。
分享到:
相关推荐
本文归纳了js面向对象的几种常见写法,分享给大家供大家参考,具体内容如下 1.工厂方式 var Circle = function() { var obj = new Object(); obj.PI = 3.14159; obj.area = function( r ) { return this.PI * ...
下面小编就为大家带来一篇归纳下js面向对象的几种常见写法总结。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
JS的语法非常灵活,简单的对象创建就有好几种不同的方法。这些过于灵活的地方有时候确实很让人迷惑,那么今天我们就来梳理一下JS中常用的创建对象的几种方法吧
早期的javascript需求都很简单,基本都是写成函数的,然后是面向过程的写法,后来慢慢的引入面向对象开发思想,再后来就慢慢写成类。 在js中,写成类的本质基本都是 构造函数+原型。下面,就讨论一下js类的几种写法...
相信大家对javascript中的面向对象写法都不陌生,那还记得有几种创建对象的写法吗?相信大家除了自己常写的都有点模糊了,那接下来就由我来帮大家回忆回忆吧! 1. 构造函数模式 通过创建自定义的构造函数,来定义...
前言类与实例:类的声明生成实例类与继承:如何实现继承:继承的本质就是原型链继承的几种方式类的定义、实例化类的定义/类的声明方式一:用构造函数模拟类(传统写法)/
前言类与实例:类的声明生成实例类与继承:如何实现继承:继承的本质就是原型链继承的几种方式类的定义、实例化类的定义/类的声明方式一:用构造函数模拟类(传统写法)/
今天,我就来谈谈js写法,我在开发过程中,也写了几种。对于性能方面,如果代码结构或逻辑写的不好,会造成计算机CPU的运算加大,运行性能降低,js的写法对性能的影响也是至关重要的。 通常写js组件开发的,都会用到...
在XML文档中,上述几种语句的语法都是错误的。因为: 1.所有的标记都必须要有一个相应的结束标记; 2.所有的XML标记都必须合理嵌套; 3.所有XML标记都区分大小写; 4.所有标记的属性必须用""括起来; 所以上列...
asp.net的网址重定向方法的比较:面向搜索引擎友好 也谈 ASP.NET 1.1 中 QueryString 的安全获取写法 ASP.NET运行模式:PageHandlerFactory 利用搜索引擎引用来高亮页面关键字 网站首页的自动语言切换 应用系统的多...
Spring IOC + AOP, 面向对象 + 面向切面,完善的旅程。 把以前自己的小项目加入Struts、Spring、Hibernate的元素吧。 去研究各种商业项目的业务逻辑吧,才能在你的简历中加入浓重的一笔。 EJB3.0,java在走了...
4.2.2 ready()方法的几种相同写法/86 4.3 绑定事件/86 4.4 切换事件/90 4.4.1 hover()方法/90 4.4.2 toggle()方法/93 4.5 移除事件/94 4.6 其他事件/96 4.6.1 方法one() /97 4.6.2 方法trigger () /98 4.7...