`
emlyn_1180
  • 浏览: 32834 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
最近访客 更多访客>>
社区版块
存档分类
最新评论

Javascript如何创建对象

阅读更多
除JSON外,在JavaScript中我们可以使用new操作符结合一个函数的形式来创建对象。例如:
    function MyFunc() {};         //定义一个空函数
    var anObj = new MyFunc();  //使用new操作符,借助MyFun函数,就创建了一个对象

    JavaScript的这种创建对象的方式可真有意思,如何去理解这种写法呢?

   其实,可以把上面的代码改写成这种等价形式:
    function MyFunc(){};
    var anObj = {};     //创建一个对象
    MyFunc.call(anObj); //将anObj对象作为this指针调用MyFunc函数

    我们就可以这样理解,JavaScript先用new操作符创建了一个对象,紧接着就将这个对象作为this参数调用了后面的函数。其实,JavaScript内部就是这么做的,而且任何函数都可以被这样调用!但从 “anObj = new MyFunc()” 这种形式,我们又看到一个熟悉的身影,C++和C#不就是这样创建对象的吗?原来,条条大路通灵山,殊途同归啊!

    君看到此处也许会想,我们为什么不可以把这个MyFunc当作构造函数呢?恭喜你,答对了!JavaScript也是这么想的!请看下面的代码:
 
 1     function Person(name)   //带参数的构造函数
 2     {
 3         this.name = name;   //将参数值赋给给this对象的属性
 4         this.SayHello = function() {alert("Hello, I'm " + this.name);};   //给this对象定义一个SayHello方法。
 5     };
 6 
 7     function Employee(name, salary)     //子构造函数
 8     {
 9         Person.call(this, name);        //将this传给父构造函数
10         this.salary = salary;       //设置一个this的salary属性
11         this.ShowMeTheMoney = function() {alert(this.name + " $" + this.salary);};  //添加ShowMeTheMoney方法。
12     };
13     
14     var BillGates = new Person("Bill Gates");   //用Person构造函数创建BillGates对象
15     var SteveJobs = new Employee("Steve Jobs", 1234);   //用Empolyee构造函数创建SteveJobs对象
16 
17     BillGates.SayHello();   //显示:I'm Bill Gates
18     SteveJobs.SayHello();   //显示:I'm Steve Jobs
19     SteveJobs.ShowMeTheMoney();   //显示:Steve Jobs $1234
20 
21     alert(BillGates.constructor == Person);  //显示:true
22     alert(SteveJobs.constructor == Employee);  //显示:true
23     
24     alert(BillGates.SayHello == SteveJobs.SayHello); //显示:false

    这段代码表明,函数不但可以当作构造函数,而且还可以带参数,还可以为对象添加成员和方法。其中的第9行,Employee构造函数又将自己接收的this作为参数调用Person构造函数,这就是相当于调用基类的构造函数。第21、22行还表明这样一个意思:BillGates是由Person构造的,而SteveJobs是由Employee构造的。对象内置的constructor属性还指明了构造对象所用的具体函数!

    其实,如果你愿意把函数当作“类”的话,她就是“类”,因为她本来就有“类”的那些特征。难道不是吗?她生出的儿子各个都有相同的特征,而且构造函数也与类同名嘛!

    但要注意的是,用构造函数操作this对象创建出来的每一个对象,不但具有各自的成员数据,而且还具有各自的方法数据。换句话说,方法的代码体(体现函数逻辑的数据)在每一个对象中都存在一个副本。尽管每一个代码副本的逻辑是相同的,但对象们确实是各自保存了一份代码体。上例中的最后一句说明了这一实事,这也解释了JavaScript中的函数就是对象的概念。

    同一类的对象各自有一份方法代码显然是一种浪费。在传统的对象语言中,方法函数并不象JavaScript那样是个对象概念。即使也有象函数指针、方法指针或委托那样的变化形式,但其实质也是对同一份代码的引用。一般的对象语言很难遇到这种情况。

    不过,JavaScript语言有大的灵活性。我们可以先定义一份唯一的方法函数体,并在构造this对象时使用这唯一的函数对象作为其方法,就能共享方法逻辑。例如:
    function SayHello()     //先定义一份SayHello函数代码
    {
        alert("Hello, I'm " + this.name);
    };
    
    function Person(name)   //带参数的构造函数
    {
        this.name = name;   //将参数值赋给给this对象的属性
        this.SayHello = SayHello;   //给this对象SayHello方法赋值为前面那份SayHello代码。
    };

    var BillGates = new Person("Bill Gates");   //创建BillGates对象
    var SteveJobs = new Person("Steve Jobs");   //创建SteveJobs对象
    
    alert(BillGates.SayHello == SteveJobs.SayHello); //显示:true

    其中,最后一行的输出结果表明两个对象确实共享了一个函数对象。虽然,这段程序达到了共享了一份方法代码的目的,但却不怎么优雅。因为,定义SayHello方法时反映不出其与Person类的关系。“优雅”这个词用来形容代码,也不知道是谁先提出来的。不过,这个词反映了程序员已经从追求代码的正确、高效、可靠和易读等基础上,向着追求代码的美观感觉和艺术境界的层次发展,程序人生又多了些浪漫色彩。

分享到:
评论

相关推荐

    javascript创建对象的方式(二)

    在JavaScript中,创建对象是编程的基本操作之一,它支持多种方式来实现这一目的。这篇博客“javascript创建对象的方式(二)”可能详细介绍了在JavaScript中除了最基础的字面量语法之外的其他创建对象的方法。这里...

    javascript创建对象的方式(一)

    这是最简单直观的对象创建方式,通过大括号{}定义一个对象,并在其内部用逗号分隔属性和方法。 ```javascript var person = { name: "John", age: 30, sayHello: function() { console.log("Hello, my name ...

    JavaScript学习之二 — JavaScript创建对象的8种方式

    这个方法允许我们基于现有对象创建新对象,新对象会继承传入对象的原型。 ```javascript var baseObj = { name: 'Base' }; var newObj = Object.create(baseObj); newObj.name; // 'Base' ``` 4. **Object....

    JavaScript创建对象的七种方式(推荐)

    JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以创建单个对象,显然这两种方式会产生大量的重复代码,并不适合量产。接下来介绍七种非常经典的创建对象的方式,他们也各有优缺点。 ...

    javascript创建对象的方式(四)

    在JavaScript中,创建对象是其面向对象编程的基础。本文将深入探讨四种主要的JavaScript创建对象的方法,帮助你更好地理解和运用这些技巧。 1. **字面量语法(Literal Notation)** 字面量语法是最简单直接的创建...

    javascript创建对象、对象继承的有用方式详解_.docx

    ### JavaScript 创建对象与对象继承的有效方法 #### 一、引言 JavaScript 是一种基于原型的语言,这使得其处理对象和继承的方式与传统的面向对象编程语言有所不同。本文将深入探讨 JavaScript 中创建对象及对象继承...

    javascript创建对象的方式(三)

    本文将详细探讨三种主要的创建JavaScript对象的方法,并结合“源码”与“工具”的概念,来深入理解这些方式在实际开发中的应用。 一、字面量(Literal)方式 这是最简单直接的对象创建方式,通过大括号 `{}` 将属性...

    一、JavaScript 创建对象

    这篇博客将深入探讨这些方法,帮助你更好地理解和掌握JavaScript中的对象创建。 首先,我们来看最简单的**字面量语法**。这是创建单个对象最直接的方式: ```javascript let person = { name: '张三', age: 30, ...

    javascript创建对象的3种方法

    以下将详细介绍三种创建JavaScript对象的方法及其优缺点: 1. 创建JSON对象 JSON(JavaScript Object Notation)虽然主要用于数据交换,但也可以直接用作创建对象。这种方法适用于临时或一次性使用的对象,例如...

    javascript如何创建对象

    在JavaScript中,对象可以分为系统对象和自定义对象,系统对象可以通过系统构造函数创建,如Array、Date等,而自定义对象则需要自行创建。 JavaScript创建对象的方法主要有以下几种: 一、直接创建 直接创建是通过...

    JavaScript创建对象方法实例小结

    JavaScript中创建对象有多种方式,每种方式都有其独特的使用场景和优缺点。下面将详细介绍JavaScript...在实际应用中,我们往往需要灵活运用这些模式,或者将它们结合起来,以实现更加高效和功能丰富的对象创建方式。

    JavaScript 创建对象

    JavaScript 创建对象是编程中至关重要的概念,特别是在动态类型的JavaScript中,理解不同的创建方式能帮助开发者更高效地构建和管理程序结构。以下将详细介绍几种常见的JavaScript创建对象的方法。 1. JSON方式/...

    JavaScript 创建对象和构造类实现代码

    ### JavaScript 创建对象和构造类实现代码 在JavaScript中,创建对象和定义类是进行面向对象编程的基础。本文将深入探讨几种不同的创建对象的方法以及如何通过构造函数和原型链来实现类的概念。 #### 1. 使用对象...

    跟我学习javascript创建对象(类)的8种方法

    在学习JavaScript编程时,创建对象(类)是不可或缺的一部分。JavaScript中的对象可以被视为一种容器,用于存储各种数据和功能,它们是基于键值对的集合。下面介绍使用JavaScript创建对象(类)的八种常用方法,每种...

    JavaScript创建对象的四种常用模式实例分析

    在实际开发中,根据需求选择合适的对象创建模式非常重要。工厂模式适合于创建大量具有不同属性的对象,构造函数模式适合于创建特定类型的对象,原型模式适合于创建需要共享方法的对象,组合构造函数与原型模式适合于...

    JavaScript创建对象的七种方式全面总结

    JavaScript创建对象的方式有很多,通过Object构造函数或对象字面量的方式也可以创建单个对象,显然这两种方式会产生大量的重复代码,并不适合量产。接下来介绍七种非常经典的创建对象的方式,他们也各有优缺点 工厂...

Global site tag (gtag.js) - Google Analytics