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创建对象的方法,先从最好理解的工厂模式开始:
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的。
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的作用域指向新对象,将当前运行对象的属性和方法都赋给新对象,这样对象模式称为构造函数模式
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。
考虑一下如下的情况:
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么,来吧再考虑另外一种情况,
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方法。
于是原型模式的写法如下:
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();
实际应用时,不是一成不变的套用某种模式,活学活用。需要共享方法的时候就用原型模式,需要使用副本的时候就用构造模式,还可以结合起来,把所有信息都封装在构造函数中,而通过在构造函数中初始化原型,使得对象保持了同时使用构造函数和原型的优点。
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();
JS 创建对象(常见的几种方法)的更多相关文章
- JS中常见的几种报错类型
1.SyntaxError(语法错误) 解析代码时发生的语法错误 var 1a; //Uncaught SyntaxError: Invalid or unexpected token 变量名错误 c ...
- Java 获取*.properties配置文件中的内容 ,常见的两种方法
import java.io.InputStream; import java.util.Enumeration; import java.util.List; import java.util.Pr ...
- Python中执行系统命令常见的几种方法--转载
Python中执行系统命令常见的几种方法 Python中执行系统命令常见的几种方法有: (1)os.system # 仅仅在一个子终端运行系统命令,而不能获取命令执行后的返回信息 # 如果再命令行下执 ...
- 利用C#实现AOP常见的几种方法详解
利用C#实现AOP常见的几种方法详解 AOP面向切面编程(Aspect Oriented Programming) 是通过预编译方式和运行期动态代理实现程序功能的统一维护的一种技术. 下面这篇文章主要 ...
- ajax请求参数中含有特殊字符"#"的问题 (另附上js编码解码的几种方法)
使用ajax向后台提交的时候 由于参数中含有# 默认会被截断 只保留#之前的字符 json格式的字符串则不会被请求到后台的action 可以使用encodeURIComponent在前台进行编码, ...
- JS中常见的几种继承方法
1.原型链继承 // 1.原型链继承 /* 缺点:所有属性被共享,而且不能传递参数 */ function Person(name,age){ this.name = name this.age = ...
- JS 判断数据类型的三种方法
说到数据类型,我们先理一下JavaScript中常见的几种数据类型: 基本类型:string,number,boolean 特殊类型:undefined,null 引用类型:Object,Functi ...
- 【JS】<a>标签调用js中函数的几种方法
我们常用的在a标签中有点击事件: a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而 ...
- js 判断数据类型的几种方法
判断js中的数据类型有一下几种方法:typeof.instanceof. constructor. prototype. $.type()/jquery.type(),接下来主要比较一下这几种方法的异 ...
随机推荐
- javascript 对象属性的添加,删除,json对象和字符串转换方法等
1:动态添加 对象属性 var obj = new Object(); console.log (obj.username); obj.username = "haha"; con ...
- WIN7无法卸载掉中文繁体注音输入法
WIN7无法卸载掉中文繁体注音输入法 不知何时系统里被自动安装了个中文繁体的注音输入法,每次启动都会替换默认的简体搜狗拼音,而且最要命的是在输入法选择栏里面没有出现这个繁体的输入法,而任务栏里却总是有 ...
- 天地图应用ArcGIS发布的服务(转)
天地图应用ArcGIS发布的服务 本文包含三个部分:利用ArcMap将Excel的数据转化为ArcGIS MXD文件.利用ArcMap发布服务.天地图添加ArcGIS发布的服务. 一 MXD文件的生成 ...
- Android服务之bindService源代码分析
上一篇分析startService时没有画出调用ActivityManagerService之前的时序图,这里画出bindService的时序图.它们的调用流程是一致的. 先看ContextWrapp ...
- 如何使用CodeSmith批量生成代码
在上一篇我们已经用PowerDesigner创建好了需要的测试数据库,下面就可以开始用它完成批量代码生成的工作啦. 下面我会一步步的解释如何用CodeSmith实现预期的结果的,事先声明一下,在此只做 ...
- webstorm定位如何在代码后面?
写代码的时候定位总是在任意一点,而不是在代码的最后面. 以至于写代码的时候总会莫名其妙出现很多空格之类的奇怪报错. 取消图中选项
- functools.wraps
我们在使用 Decorator 的过程中,难免会损失一些原本的功能信息.直接拿 stackoverflow 里面的栗子 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 ...
- MySQL的查询,子查询,联结查询,联合查询
MySQL的查询,子查询,联结查询,联合查询 一.mysql查询的五种子句where(条件查询).having(筛选).group by(分组).order by(排序).limit(限制结果数) 二 ...
- 渐进式 JPEG (Progressive JPEG)来提升用户体验
1.概述 jpg格式分为:Baseline JPEG(标准型)和Progressive JPEG(渐进式).两种格式有相同尺寸以及图像数据,扩展名也是相同的,唯一的区别是二者显示的方式不同. Base ...
- C#代码用法
1.new的用法using System;using System.Collections.Generic;using System.Text;namespace yanz{public class ...