`
hongwei3344661
  • 浏览: 31637 次
  • 性别: Icon_minigender_1
文章分类
社区版块
存档分类
最新评论

js创建对象的几种方式

 
阅读更多

  1. 使用Object构造函数来创建一个对象,下面代码创建了一个person对象,并用两种方式打印出了Name的属性值。

    var person = new Object();
    person.name="kevin";
    person.age=31;
    alert(person.name);
    alert(person["name"])

  2. 使用对象字面量创建一个对象;不要奇怪person["5"],这里是合法的;另外使用这种加括号的方式字段之间是可以有空格的如person["my age"].

复制代码
    var person = 
    {
        name:"Kevin",
        age:31,
        5:"Test"
    };
    alert(person.name);
    alert(person["5"]);
复制代码

  3. 使用工厂模式创建对象,返回带有属性和方法的person对象。

复制代码
function createPerson(name, age,job)
{
    var o = new Object();
    o.name=name;
    o.age=31;
    o.sayName=function()
    {
        alert(this.name);
    };
    return o;
}
createPerson("kevin",31,"se").sayName();
复制代码

  4. 使用自定义构造函数模式创建对象;这里注意命名规范,作为构造函数的函数首字母要大写,以区别其它函数。这种方式有个缺陷是sayName这个方法,它的每个实例都是指向不同的函数实例,而不是同一个。

复制代码
function Person(name,age,job)
{
    this.name=name;
    this.age=age;
    this.job=job;
    this.sayName=function()
    {
        alert(this.name);
    };
}

var person = new Person("kevin",31,"SE");
person.sayName();
复制代码

  5. 使用原型模式创建对象;解决了方法4中提到的缺陷,使不同的对象的函数(如sayFriends)指向了同一个函数。但它本身也有缺陷,就是实例共享了引用类型friends,从下面的代码执行结果可以看到,两个实例的friends的值是一样的,这可能不是我们所期望的。

复制代码
function Person()
{

}

Person.prototype = {
    constructor : Person,
    name:"kevin",
    age:31,
    job:"SE",
    friends:["Jams","Martin"],
    sayFriends:function()
    {
        alert(this.friends);
    }
};
var person1 = new Person();
person1.friends.push("Joe");
person1.sayFriends();//Jams,Martin,Joe
var person2 = new Person(); 
person2.sayFriends();//James,Martin,Joe
复制代码

  6. 组合使用原型模式和构造函数创建对象,解决了方法5中提到的缺陷,而且这也是使用最广泛、认同度最高的创建对象的方法。

复制代码
function Person(name,age,job)
{
    this.name=name;
    this.age=age;
    this.job=job;
   this.friends=["Jams","Martin"];
}
Person.prototype.sayFriends=function()
{
    alert(this.friends);
};
var person1 = new Person("kevin",31,"SE");
var person2 = new Person("Tom",30,"SE");
person1.friends.push("Joe");
person1.sayFriends();//Jams,Martin,Joe
person2.sayFriends();//Jams,Martin
复制代码

 7. 动态原型模式;这个模式的好处在于看起来更像传统的面向对象编程,具有更好的封装性,因为在构造函数里完成了对原型创建。这也是一个推荐的创建对象的方法。

复制代码
function Person(name,age,job)
{
    //属性
    this.name=name;
    this.age=age;
    this.job=job;
    this.friends=["Jams","Martin"];
    //方法
    if(typeof this.sayName !="function")
    {
        Person.prototype.sayName=function()
        {
            alert(this.name);
        };
        
        Person.prototype.sayFriends=function()
        {
            alert(this.friends);
        };
    }
}

var person = new Person("kevin",31,"SE");
person.sayName();
person.sayFriends();
复制代码

另外还有两个创建对象的方法,寄生构造函数模式和稳妥构造函数模式。由于这两个函数不是特别常用,这里就不给出具体代码了。

写了这么多创建对象的方法,其实真正推荐用的也就是方法6和方法7。当然在真正开发中要根据实际需要进行选择,也许创建的对象根本不需要方法,也就没必要一定要选择它们了。

分享到:
评论

相关推荐

    javascript创建对象的方式(二)

    这篇博客“javascript创建对象的方式(二)”可能详细介绍了在JavaScript中除了最基础的字面量语法之外的其他创建对象的方法。这里我们将深入探讨几种常见的创建对象的方式。 1. **构造函数**: JavaScript中的...

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

    JavaScript是Web开发中不可或缺的一部分,尤其在前端领域更是发挥着...以上就是JavaScript创建对象的8种常见方式,每种方式都有其适用场景和优缺点。理解并熟练运用这些技巧,可以帮助你在JavaScript开发中游刃有余。

    js创建对象几种方式的优缺点对比

    本文将详细对比JavaScript创建对象的五种常见方式:工厂模式、构造函数、原型方法、构造函数与原型方法的组合以及动态原型方法,分析它们的优缺点。 1. 工厂模式: 工厂模式是一种创建对象的方式,通过函数来创建...

    js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式).docx

    ### JavaScript面向对象之常见创建对象的方式 #### 引言 JavaScript 的灵活性体现在其创建对象的多种方式上。本文将详细介绍三种常见的对象创建方法:工厂模式、构造函数模式以及原型模式,并探讨它们各自的优缺点...

    【JavaScript源代码】详解js创建对象的几种方式和对象方法.docx

    本文将深入探讨JavaScript中创建对象的几种常见方式以及对象方法。 首先,我们来看“工厂模式”。工厂模式是一种创建对象的抽象方式,通过一个函数来返回一个新的对象。例如: ```javascript function getObj(name...

    javascript创建对象的方式(一)

    这篇博文主要探讨了JavaScript创建对象的几种常见方式,这对于理解和掌握JavaScript面向对象编程至关重要。在实际开发中,了解并灵活运用这些方法能够提高代码的可读性和可维护性。下面,我们将详细讲解标题中提到的...

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

    JavaScript作为一门面向对象的脚本语言,其创建对象的方式多种多样,每种方式都有其独特的特点和适用场景。下面我们逐一分析给定文件中所提到的几种创建对象的方法。 首先是使用构造函数模式创建对象。构造函数是...

    在js中创建类和对象

    本文将详细介绍几种常见的创建对象的方法,包括它们的特点和优缺点。 5.1 工厂方法 工厂方法是一种创建对象的模式,通过一个函数来创建具有特定属性和行为的对象。在JavaScript中,我们可以定义一个函数,如`...

    JS创建对象的几中方式

    在JavaScript中,创建对象有多种方法,每种方式都有其优缺点。以下是对这些方法的详细解释: 1. **工厂方式**: 工厂函数是通过一个函数来创建对象,它可以根据需要设置属性和方法。然而,这种方法的缺点是每个...

    javascript如何创建对象

    JavaScript创建对象的方法主要有以下几种: 一、直接创建 直接创建是通过new Object()来创建一个新的空对象,然后逐步给这个对象添加属性和方法。例如,创建一个名为person1的对象,并添加name、gender属性,以及一...

    js面向对象之常见创建对象的几种方式(工厂模式、构造函数模式、原型模式)

    在上篇文章给大家介绍了javascript面向对象基础,本...因此为了解决这个问题,人们开始使用以下几种方式来常见对象。 工厂模式 该模式抽象了创建对象的具体过程,用函数来以特定接口创建对象的细节 function cPerson

    js创建对象的几种常用方式小结(推荐)

    本文将详细介绍JavaScript创建对象的几种常见方式,以及它们的优缺点。 首先,我们来看**工厂模式**。这种方式通过一个函数来创建对象,它能创建具有相同属性和方法的对象。然而,工厂模式的缺点在于它没有明显的...

    JS对象创建的几种方式整理

    最近一直在看JS高级程序设计这本书,有空来梳理一下几种创建对象的方式。话不多说,直接步入正题。 第一种:Object构造函数创建 var Person = new Object(); Person.name = 'Nike'; Person.age = 29; 这行代码创建...

    JS 5种遍历对象的方式

    感觉事情并不这么简单,于是我仔细看了一下这几种遍历对象的方法的区别 for in for in 循环是最基础的遍历对象的方式,它还会得到对象原型链上的属性 // 创建一个对象并指定其原型,bar 为原型上的属性 const obj =...

    javascript中创建对象的几种方法总结

    在JavaScript中,有几种常见的创建对象的方法,这里我们将详细探讨这些方法。 1. **对象字面量**:这是最简单且直观的创建对象的方式。通过大括号 `{}` 创建一个空对象,然后通过点`.`或方括号`[]`来添加属性和方法...

    JAVASCRIPT中定义对象的几种方式.pdf

    在讨论JavaScript中定义对象的几种方式之前,我们先理解一下JavaScript中的对象到底是什么。JavaScript是一种基于原型的编程语言,对象是其核心概念之一。对象可以被视为一个容器,存储各种键值对集合,键为属性名,...

    在javascript中创建对象的各种模式解析

    在JavaScript中创建对象主要涉及以下几种模式: 1. 工厂模式 工厂模式是最早期的对象创建方式之一,它通过一个函数来创建对象,并返回新创建的对象。这种方法的核心是利用函数封装创建对象的细节,然后通过返回值来...

Global site tag (gtag.js) - Google Analytics