zoukankan      html  css  js  c++  java
  • Javascript 创建对象方法的总结

    最近看了一下《Javascript高级程序设计(第三版)》,这本书很多人都推荐,我也再次郑重推荐一下。看过之后总得总结一下吧,于是我选了这么一个主题分享给大家。

      使用Javascript创建对象的方法有很多,现在就来列举一下:

      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。当然在真正开发中要根据实际需要进行选择,也许创建的对象根本不需要方法,也就没必要一定要选择它们了。

  • 相关阅读:
    CodeForces 706C Hard problem
    CodeForces 706A Beru-taxi
    CodeForces 706B Interesting drink
    CodeForces 706E Working routine
    CodeForces 706D Vasiliy's Multiset
    CodeForces 703B Mishka and trip
    CodeForces 703C Chris and Road
    POJ 1835 宇航员
    HDU 4907 Task schedule
    HDU 4911 Inversion
  • 原文地址:https://www.cnblogs.com/lxl57610/p/6289520.html
Copyright © 2011-2022 走看看