美文网首页
面向对象--第二弹创建对象

面向对象--第二弹创建对象

作者: 赵BW | 来源:发表于2017-04-20 15:20 被阅读0次

    JS创建对象的方式:
    下面的例子,我们都是new一个人的对象。这个对象有方法和属性。


    对象字面量:
     var person = {
           name:'zhaobw',
           age:23,
           gender:'man',
           run:function(){
                 console.log("我会跑步");
           }
     }
    

    我们创建了一个person对象。调用对象的方法和属性如下操作:

     console.log(person.name);   //zhaobw   
     console.log(person.age);    //23
     console.log(person.gender); //man
     person.run();               //我会跑步
    

    缺点:特麻烦。为什么麻烦?

    • 如果我要在创建一个name是Tom的对象,就要在重新写一个对象。而这两个对象,只有名字不同,而其他的都一样。这样就很浪费空间。所以这个方法不推荐使用。
    利用内置对象来创建对象
      var str = new String(); 
      var obj = new Object();
      obj.name = "zhaobw";
      obj.age = "22";
      obj.gender = "man";
      obj.run = fnction(){
         console.log("我会跑步");
      }
    

    缺点:还是麻烦。同上。

    • 一般创建对象都用Object。很少用String这些。因为Object是一张干净的白纸。你想怎么写,就怎么写。然而String还自带一些方法。如果在写的时候,不小心覆盖了,就不好了。所以一般选用像白纸一样的Object,干净。
    构造函数--工厂模式
     function Person(name,age,gender){
          var obj = new Object();
          obj.name = name;
          obj.age = age;
          obj.gender = gender;
          obj.run = function(){
             console.log("我会跑步");
          };
          return obj;
     }
    

    缺点:没有语法new和想象的中的不一样。还有一个严重的问题就是函数不是共用的。举个例子:
    var Tom = Person(tom,22,man);
    var Zhaobw = Person(zhaobw,23,man);

    • 首先我们这个方法解决了前面的问题。每次只需调用一次函数就可以得到一个对象。是不是很方便。
    • Zhaobw.run() === Tom.run() // false。说明这连个两个对象的方法不相等。但是两个对象的方法内容是一模一样的。这明显在浪费存储空间。这样可不行。
    构造函数 -- new
     function person(name,age,gender){
          this.name = name;
          this.age = age;
          this.gender =gender;
          this.run = function(){
             console.log("我会跑步");
          }
     }
     var tom = new person("zhaobw",23,man);
    

    缺点:函数还是不能共用。

    • 我们解决new的问题了。这里new做了什么事啊?我会在下面详细说明的。

    new这个操作做了这几步:

    • 创建了一个空对象,作为this。
    • this.proto指向构造函数的prototype
      (proto和prototype会在单独详解,目前可以暂时不理解)
    • 运行构造函数
    • 返回this.

    new做的操作其实就是帮我们前面的创建对象的方法。少写了几步。这是来自JS之父的关爱。是不是很有爱。new的作用就是可以让我们少些几行代码。所以就是个语法糖。这都是前辈的关爱。


    现在就剩下函数共用的问题没有解决了。来吧放大招了。


    原型模式(名字很吓人,别怕)
     function person(name,age,gender){
          this.name = name;
          this.age = age;
          this.gender =gender
     }
     person.prototype.run = function(){
             console.log("我会跑步");           
     }
    

    这样就解决了函数共用的问题。和上面的写法的有什么区别?
    就是多了个prototype--原型。关于原型我会单独写一章。这个很有用的。
    好了。 共用的放在原型里,不一样的放够着函数里。

    这篇文章从最初怎么创建对象,以及为什么这么创建一步步写下来了。希望对你有用。本文涉及了this、原型。这些概念我会在后面详细讲解。一起努力吧。

    相关文章

      网友评论

          本文标题:面向对象--第二弹创建对象

          本文链接:https://www.haomeiwen.com/subject/gyhkzttx.html