JS 创建对象(常见的几种方法)

JS 创建对象(常见的几种方法)

贴个代码先: 
function O(user,pwd){ //use constructor 
this.user=user; 
this.pwd=pwd; 
this.get=get; 
return this; 

function O2(user,pwd){ //use factory 
var obj=new Object(); 
obj.user=user; 
obj.pwd=pwd; 
obj.get=get; 
return obj; 

function O3(){ //use prototype 

O3.prototype.user=’abc’; 
O3.prototype.pwd=’dis’; 
// O3.propotype.get=’get’; 
//O3.prototype.get(){ 
//alert(this.pwd); 
//} 
function O4(user,pwd){ 
this.user=user; 
this.pwd=pwd; 
return this; 

O4.prototype.get=function(){alert(‘123’);} 

//function get(){ 
//alert(“This User:”+this.user); 
// } 
function test2(){ 
//var a=new O2(‘Us’,’Pw’); use factory & constructor 
//var a=new O3(); //use prototype 
//a.get(); 
var a=new O4(‘*U4′,’P4’); //混合 
//a.user=’Not ABC’; //set new property 
//alert(a.user); 
a.get(); 

常用的MS 就这几种,可能还有其它的.碰到再说吧…. 
题 外话:昨天手欠,试图用alert(window.appName)到ff之下去查看浏览器版本,结果弹出的竟然是Netscape,咋不是 firefox。继而又跑去chrome下试验,又一次弹出了Netscape。baidu搜 Netscape 竟然发现js就出自Netscape公司。惭愧啊惭愧!!!研究了这么久的js都不认识祖师爷。于是又跑去找了找族谱,原来js出自Brendan Eich之手,95年他创造js时候,也不过就31岁。哎呀,真是白活了,如他一般老的我,到现在都学不会js,真是人比人气死人。。js当初设计的时 候,没有想到自己能从一部打电话用的手机变成集拍照,上网,游戏,电话于一身的智能机。真是造化弄人!!!也许各中的神奇,连Brendan Eich本人都没有想到。应该说Brendan Eich创造了js,而一大批的js牛人成就了今天如此复杂的js。 
js不是木有类么?没关系,人家不是设计了原型属性么~ 
js不是木有块级作用域么?没关系,人家不是有作用域链么~ 
js怎样实现成员变量私有化?哦,用闭包解决吧~ 
哦,这么多基本概念,彻底的晕掉了,路漫漫其修远兮。 
言归正传,本文讨论几种js创建对象的方法,先从最好理解的工厂模式开始: 

复制代码 代码如下:

function createPerson(name,age,job){ 

var o = {}; 

o.name = name; 

o.age = age; 

o.job = job; 

o.sayName = function(){ 

alert(this.name); 

}; 

return o; 



var tanya = createPerson(“tanya”,”30″,”female”); 

var ansel = createPerson(“ansel”,”30″,”male”); 

tanya.sayName(); 

ansel.sayName(); 

这里先定义o为一个空的对象,然后为o设置了一堆属性。其实也可以直接给o属性的嘛,所以如果这样写也是ok的。 

复制代码 代码如下:

function createPerson(name,age,job){ 

var o = { 

name : name, 

age : age, 

job : job, 

sayName : function(){ 

alert(this.name); 



}; 

return o; 



var tanya = createPerson(“tanya”,”30″,”female”); 

var ansel = createPerson(“ansel”,”30″,”male”); 

tanya.sayName(); 

ansel.sayName(); 

还有一种办法是利用无敌的this,因为this就表示当前运行时的对象,将构造函数this的作用域指向新对象,将当前运行对象的属性和方法都赋给新对象,这样对象模式称为构造函数模式 

复制代码 代码如下:

function Person(name,age,job){ 

this.name = name; 

this.age = age; 

this.job = job; 

this.sayName = function(){ 

alert(this.name); 

}; 



var tanya = new Person(“tanya”,”30″,”female”); 

var ansel = new Person(“ansel”,”30″,”male”); 

tanya.sayName(); 

ansel.sayName(); 

在这个例子中,tanya和ansel都有一个constructor属性,该属性指向person。 
考虑一下如下的情况: 

代码如下:

function Person(name,age,job){ 

this.name = name; 

this.age = age; 

this.job = job; 

this.sayName = function(){ 

alert(this.name); 

}; 



Person(“tanya”,”30″,”female”); 

Person(“ansel”,”30″,”male”); 

window.sayName(); 

window.sayName(); 

发现两次弹出的都是ansel,这是因为不用new的话,就不是一个person的实例,而仅仅在执行函数。而在全局作用域调用一个函数时this总是指向Global对象。而Global对象在浏览器中就是window对象。 
我们还可以用构造模式在另外一个对象中调用sayName方法,还记得Apply和call么,来吧再考虑另外一种情况, 

代码如下:

function Person(name,age,job){ 

this.name = name; 

this.age = age; 

this.job = job; 

this.sayName = function(){ 

alert(this.name); 

}; 



var olivia = {}; 

Person.call(olivia,”tanya”,”30″,”female”); 

olivia.sayName(); 

var philip = {} 

Person.apply(philip,[“ansel”,”30″,”male”]); 

philip.sayName(); 

原型模式就要考虑原型链了,分析一下,sayName方法在实例中被重复定义了两次,但其实没有必要创造两个一样的副本。使用原型方法,可以使是tanya和ansel的共享一个sayName方法。 
于是原型模式的写法如下: 

代码如下:

function Person(name,age,job){ 

this.name = name; 

this.age = age; 

this.job = job; 



Person.prototype.sayName= function(){ 

alert(this.name); 

}; 

var tanya = new Person(“tanya”,”30″,”female”); 

var ansel = new Person(“ansel”,”30″,”male”); 

tanya.sayName(); 

ansel.sayName(); 

实际应用时,不是一成不变的套用某种模式,活学活用。需要共享方法的时候就用原型模式,需要使用副本的时候就用构造模式,还可以结合起来,把所有信息都封装在构造函数中,而通过在构造函数中初始化原型,使得对象保持了同时使用构造函数和原型的优点。 

代码如下:

function Person(name,age,job){ 

this.name = name; 

this.age = age; 

this.job = job; 

if (typeof sayName != “function” ){ 

Person.prototype.sayName= function(){ 

alert(this.name); 

}; 





var tanya = new Person(“tanya”,”30″,”female”); 

var ansel = new Person(“ansel”,”30″,”male”); 

ansel.sayName = function () { 

alert(“Hi ansel, how hansome you are!”); 



tanya.sayName(); 

ansel.sayName();

转载于:https://www.cnblogs.com/jakywong5701219/p/5538205.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/108998.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 泰勒展开式「建议收藏」

    泰勒展开式「建议收藏」数学中,泰勒公式是一个用函数在某点的信息描述其附近取值的公式。如果函数足够平滑的话,在已知函数在某一点的各阶导数值的情况之下,泰勒公式可以用这些导数值做系数构建一个多项式来近似函数在这一点的邻域中的值

    2022年8月2日
    6
  • Android NDK开发:打包so库及jar包供他人使用

    Android NDK开发:打包so库及jar包供他人使用Android的NDK开发相信各位已经精通各种姿势了。不过基本上都是那种native代码和java代码都在同一个工程中,因为应用从头到脚都是我们自己的,也不需要分离。但有时候可能需要我们自己把某些库打包起来供别人使用,或者使用别人提供给我们的库。本篇文章及下篇文章就讲讲so库如何打包。一、目标及方式这篇文章会讲第一种方式来打包so库,这种方式是基于jni层的,需要我们同时提供接口的jar包…

    2022年6月22日
    148
  • 查理德弗曼学习法

    查理德弗曼学习法费曼学习法的灵感源于诺贝尔物理奖获得者理查德·费曼(RichardFeynman),运用费曼技巧,你只需花上20分钟就能深入理解知识点,而且记忆深刻,难以遗忘。知识有两种类型,我们绝大多数人关注的都是错误的那类。第一类知识注重了解某个事物的名称。第二类知识注重了解某件事物。这可不是一回事儿。著名的诺贝尔物理学家理查德·费曼(RichardFeynman)能够理解这二者间的差别,这也是他成功最重要的原因之一。事实上,他创造了一种学习方法,确保他会比别人对事物了解的更透彻。费曼学习法可以简化为四个单词:C

    2022年6月14日
    39
  • html2canvas, JsPDF生成pdf

    html2canvas, JsPDF生成pdf创建 pdf js 引入依赖 importVuefro vue importhtml2c html2canvas importJsPDFf jspdf constPDF PDF install function Vue options targetDom 需要打印的 dom 对象 name pdf 的名字 callback 回调函数 Vue prototype create

    2025年7月12日
    5
  • 用java判断闰年的条件解释_Java判断闰年的2种方法示例

    用java判断闰年的条件解释_Java判断闰年的2种方法示例前言:给定一个年份,判断这一年是不是闰年。当以下情况之一满足时,这一年是闰年:1.年份是4的倍数而不是100的倍数;2.年份是400的倍数。其他的年份都不是闰年。方法一:publicclassBissextile{booleanbissextile(intyear){//创建boolean类型的方法if(year%4==0&&year%100!=…

    2022年7月8日
    26
  • errno.h是什么头文件(unistd.h是什么头文件)

    注意:只有当一个库函数失败时,errno才会被设置。当函数成功运行时,errno的值不会被修改。这意味着我们不能通过测试errno的值来判断是否有错误存在。反之,只有当被调用的函数提示有错误发生时检查errno的值才有意义。查看错误代码errno是调试程序的一个重要方法。当linuxCapi函数发生异常时,一般会将errno变量(需includeerrno.h)赋一个整数值,不同的值表示不

    2022年4月16日
    50

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号