Javascript中的对象和原型(二)

在上篇文章中JavaScript中的对象和原型(一)提到了JavaScript中对象的创建的一些基本操作，接下来讨论下继续讨论。

　　一 工厂模式

　　我们知道，要创建一个对象我们可以用如下代码：

var user = new Object(); //使用new运算符创建一个对象
user.name = '念在三角湖畔'; //给对象添加属性
user.age = 22;
user.address = '湖北武汉';
alert(user.name + " " +user.age);//返回 '念在三角湖畔 湖北武汉'

　　用这样的方法创建对象比较简单直观，也是JavaScript种创建对象最基本的方法。但是这样就有一个问题，如果我们需要创建多个对象，那么我就得写很多重复的代码。比如我们想创建另一个对象user1，我们就得重新将上面的代码重新写一遍，这在实际开发过程中是不合适的，这样如果对象过多，代码量将大大增加。

　　为了解决这样的问题，我们可以使用一种叫做工厂模式的方法，这种方法 就是为了解决实例化对象产生大量重复代码的问题。

function create(name, age) {
　　var obj = new Object();
　　obj.name = name;
　　obj.age = age;
　　obj.run = function () {
　　　　return this.name +' '+ this.age;
　　};
　　return obj;
}
var obj1= create('ZXC', 10); //第一个实例
var obj2= create('CXZ', 20); //第二个实例
alert(obj1.run());
alert(obj1.run());

　从上面的代码我们可以看出，工厂模式解决了实例化时代码大量重复的问题，但又出现了一个问题，那就是识别问题，我们根本无法弄清楚他们到底是哪个对象的实例。比如

alert(typeof obj1); //Object
alert(obj1 instanceof Object); //true

　　以上代码标明box1是Object对象，但是我们无法知道具体是哪一个对象创建的。

　　二 构造函数(构造方法)

　　为了解决上面的问题，我们可以用构造方法去创建对象。构造函数和普通函数的唯一区别，就是调用的方式不同。但是，构造函数同样是函 数。

function User(name, age) { //构造函数模式
　　this.name = name;
　　this.age = age;
　　this.run = function () {
　　　　return this.name + ' '+this.age; 　　};
}

　　创建对象的时候用new运算符就可以了：

var user1= new User('ZXC', 25);
var user2= new User('CXZ', 22);

　　现在我们就可以检测user1或者user2是不是属于User。

alert(user1 instanceof User);//true　

　　可见，使用构造函数的方法，即解决了重复实例化的问题，又解决了对象识别的问题。

　　使用构造函数时执行的过程如下：

　　1.执行 new 构造函数()时，后台执行了 new Object()；

　　2.将构造函数的作用域给新对象。

　　3.执行构造函数内的代码；

　　4.后台直接返回新对象。

　　接下来我们看看构造函数内部的函数问题。如果我们执行以下语句：

alert(user1.run==user2.run);//结果返回的是false

　　结果返回的是false，这就说明方法其实也是一种引用地址。如果我们同样重复创建了多个对象，那么每个对象中的方法都会在内存中开辟新的空间，这样浪费的空间就比较多。要解决这个问题，我们就需要用到实例属性或者方法的共享，下一篇文章中将继续探讨解决这个问题。

以上所述是小编给大家介绍的Javascript中的对象和原型(二)，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • Javascript 遍历对象中的子对象

    复制代码 代码如下: var json_obj = { pos1:{x1:123, x2:234, y1:222, y2:333}, pos2:{x1:999, x2: 888, y1:777, y2:666} }; for (var p in json_obj) { alert(json_obj[p].x1); } 这个方法也可以扩展一下,比如遍历对象中的属性,对象中的函数等.

  • JavaScript中子对象访问父对象的方式详解

    在传统面向对象的编程语言里,都会提供一种子类访问父类的特殊语法,引文我们在实现子类方法往往需要父类方法的额外辅助.在这种情况下,子类通常会调用父类中的同名方法,最终以便完成工作. javascript虽然没有类似上述的特殊语法,但我们可以造一个啊! function her(){}; her.prototype.name = 'Anna'; her.prototype.toString = function(){ var const = this.constructor; return cons

  • javascript客户端遍历控件与获取父容器对象示例代码

    1,遍历也面中所有的控件function findControlAll()    {        var inputs=document.getElementsByTagName("input");        for(j=0;j<inputs.length;j++)           if(inputs[j].type=="text") //这儿将页面所有类型为text的控件找出来,也可以设置成你想遍历的控件类型       {            

  • JavaScript中的对象和原型(一)

    面向对象的语言(如Java)中有类的概念,而通过类可以创建任意多个具有相同属性和方法的对象.但是,JavaScript 没有类的概念,因此它的对象也与基于类的语言中的对象有所不同. 要了解面向对象,首先就要了解Javascript中的对象和原型.这篇文章中主要学习一下Javascript中的对象. 一 关于对象 对象其实就是一种引用类型.而对象的值就是引用类型的实例.在JavaScript 中引用类型是一种数据结构,将数据和功能组织在一起.它也常被称做为类,但JavaScript 中却没有类的概

  • Javascript中的对象和原型(二)

    在上篇文章中JavaScript中的对象和原型(一)提到了JavaScript中对象的创建的一些基本操作,接下来讨论下继续讨论. 一 工厂模式 我们知道,要创建一个对象我们可以用如下代码: var user = new Object(); //使用new运算符创建一个对象 user.name = '念在三角湖畔'; //给对象添加属性 user.age = 22; user.address = '湖北武汉'; alert(user.name + " " +user.age);//返回

  • Javascript中获取对象的原型对象的方法小结

    在Javascript中,如果我们有一个对象但是又不知道它的构造函数时,如何获取它的原型对象呢? 在Chrome中或是FireFox浏览器中,我们可以直接使用对象的__proto__属性获取它的原型对象. 复制代码 代码如下: <!-- lang: js --> function F(){}; var foo = new F(); alert(foo.__proto__ == F.prototype); 但是,__proto__属性在IE浏览器中一直到IE11才被支持. 那么在不支持__pro

  • JavaScript中判断对象类型的几种方法总结

    我们知道,JavaScript中检测对象类型的运算符有:typeof.instanceof,还有对象的constructor属性: 1) typeof 运算符 typeof 是一元运算符,返回结果是一个说明运算数类型的字符串.如:"number","string","boolean","object","function","undefined"(可用于判断变量是否存在). 但 type

  • javascript中JSON对象与JSON字符串相互转换实例

    本文实例讲述了javascript中JSON对象与JSON字符串相互转换实现方法.分享给大家供大家参考.具体如下: <script type="text/javascript"> // 根据JSON对象的属性的名称获取属性的值 var jsonObj = { name: "jxqlovejava" }; // JSON对象 console.log(jsonObj.name); // "jxqlovejava" var jsonStr

  • JavaScript 中Date对象的格式化代码方法汇总

    JavaScript默认的时间格式我们一般情况下不会用,所以需要进行格式化,下面说说我总结的JavaScript时间格式化方法. 很多时候,我们可以利用JavaScript中Date对象的内置方法来格式化,如: var d = new Date(); console.log(d); // 输出:Mon Nov 04 2013 21:50:33 GMT+0800 (中国标准时间) console.log(d.toDateString()); // 日期字符串,输出:Mon Nov 04 2013

  • JavaScript中的对象的extensible属性介绍

    JavaScript中,对象的extensible属性用于表示是否允许在对象中动态添加新的property.ECMAScript 3标准中,所有的对象都是extensible的.ECMAScript 5标准中,所有的对象默认仍是extensible的,但可以通过设定来改变这一属性. 查询一个对象是否是extensible的,可以使用Object.isExtensible()语句: 复制代码 代码如下: var o = {x:1}; console.log(Object.isExtensible(

  • JavaScript中的对象继承关系

    我们今天就来看一下继承中的类继承以及类继承和原型继承的混用,所谓类继承,就是使用call或者apply方法来进行冒充继承: function Desk(size,height){ this.size=size; this.height=height; } function MJDesk(size,height){ Desk.call(this,size,height);//这种就叫类继承. } var mj = new MJDesk(10,123); 像上面这种就是我们要使用的类继承,用这种继承

  • javascript中String对象的slice()方法分析

    本文较为详细的分析了javascript中String对象的slice()方法.分享给大家供大家参考.具体分析如下: 此方法截取字符串中的一段,并返回由被截取字符组成的新字符串. 注:原字符串不会发生改变,返回值是一个新产生的字符串. 语法结构: 复制代码 代码如下: stringObject.slice(start,end) 参数列表: 参数 描述 start  必需.规定从何处开始截取字符串.字符串的首字符的位置是0. 如果此参数为负数,那么将从字符串的尾部开始计算位置.例如:-1代表倒数第

  • javascript中Date对象应用之简易日历实现

    javascript中Date对象应用之简易日历实现

    前面的话 简易日历作为javascript中Date对象的常见应用,用途较广泛,本文将详细说明简易日历的实现思路. 效果演示 HTML说明  使用type=number的两个input分别作为年和月的输入控件,这样在高级浏览器下自带调节按钮  按照周日到周一的顺序进行星期的排列 <div class="box"> <header class='control'> <input id="conYear" class="con-i

随机推荐