彩世界平台-彩世界时时app-彩世界开奖app苹果下载

热门关键词: 彩世界平台,彩世界时时app,彩世界开奖app苹果下载

您的位置:彩世界平台 > 新闻动态 > Javascript 构造函数详解,javascript构造函数

Javascript 构造函数详解,javascript构造函数

发布时间:2019-09-01 06:16编辑:新闻动态浏览(62)

    Javascript 构造函数详解,javascript构造函数

    一、什么是构造函数

    在一些面向对象的语言,如Java、C++、PHP中,构造函数是很常见的。在Javascript中构造函数首先是一个普通的函数,它可以使用new 操作符来调用,并生成一个特殊类型的对象。

    复制代码 代码如下:

    // "Benjamin" is a constructor
    var benjamin = new Benjamin("zuojj", "male");

    在上面这个实例中benjamin是一个Benjamin对象,那么它是如何来实例化的呢?

    复制代码 代码如下:

    function Benjamin(username, sex) {
        this.username = username;
        this.sex = sex;
    }
    var benjamin = new Benjamin("zuojj", "male");
    //Outputs: Benjamin{sex: "male",username: "zuojj"}
    console.log(benjamin);

    正如我们所看到的,“Benjamin”构造函数仅仅是接收传递过来的参数,并把它们赋值给this对象。这是因为当构造函数被new操作符调用时,构造函数的this对象赋值为new操作返回的对象。
    这意味着上面的代码等同于:

    复制代码 代码如下:

    benjamin = {
     "username": "zuojj",
     "sex": "male"
    }

    二、为什么使用构造函数

    为什么使用构造函数,有以下几个方面的原因:
    1.使用构造函数,意味着所有的这些对象,都可以使用相同的基本结构创建
    2.使用构造函数,意味着“benjamin”对象被明确的标记为“Benjamin”函数的实例

    复制代码 代码如下:

    function Benjamin(username, sex) {
        this.username = username;
        this.sex = sex;
    }
    var benjamin = new Benjamin("zuojj", "male");
    var ben = {
     "username": "zuojj",
     "sex": "male"
    }
    //Outputs: true
    console.log(benjamin instanceof Benjamin);
    //Outputs: false
    console.log(ben instanceof Benjamin);

    3.使用构造函数,意味着我们可以在原型上定义公共方法,供多个实例共享

    复制代码 代码如下:

    function Benjamin(username, sex) {
        this.username = username;
        this.sex = sex;
    }
    Benjamin.prototype.getName = function() {
     return this.username;
    }
    var benjamin = new Benjamin("zuojj", "male");
    var ben = new Benjamin("lemon", "female");
    //Outputs: zuojj
    console.log(benjamin.getName());
    //Outputs: lemon
    console.log(ben.getName());

    三、注意事项

    1.new 关键字
    在实例化构造函数的时候一定不要忘了使用new关键字,是否使用new关键字,对this对象的影响很大,不用new关键字的情况下,this对象会指向全局对象(window in browser and global in node)。因此定义构造函数时,建议函数名称首字母大写。
    2.如果被调用的函数没有显式的 return 表达式,则隐式的会返回 this 对象 – 也就是新创建的对象,否则将会影响返回的结果,但仅限于返回的是一个对象

    复制代码 代码如下:

    function Bar() {
        return 2;
    }
    var bar = new Bar();
    //返回新创建的对象
    //Outputs: Bar {}
    console.log(bar);
    function Test() {
        this.value = 2;
        return {
            foo: 1
        };
    }
    var test = new Test();
    //返回的对象
    //Outputs: Object {foo: 1}
    console.log(test);

    我们需要注意的是:
    a) new Bar() 返回的是新创建的对象,而不是数字的字面值 2。 因此 new Bar().constructor === Bar,但是如果返回的是数字对象,结果就不同了;
    b) 这里得到的 new Test()是函数返回的对象,而不是通过new关键字新创建的对象,如下所示:

    复制代码 代码如下:

    function Bar() {
        return 2;
    }
    var bar = new Bar();
    function BarN() {
     return new Number(2);
    }
    var barn = new BarN();
    //Outputs: true
    console.log(bar.constructor === Bar);
    //Outputs: Number {}
    console.log(barn);
    //Ouputs: false
    console.log(barn.constructor === BarN);
    //Outputs: true
    console.log(barn.constructor === Number);
    /* -------------------------------------- */
    function Test() {
        this.value = 2;
        return {
            foo: 1
        };
    }
    var test = new Test();
    //Outputs: undefined
    console.log(test.value);
    //Ouputs: 1
    console.log(test.foo);

    以上就是对构造函数的总结,希望对初学者有所帮助,文中不妥之处,望批评、斧正。

    Javascript非构造函数的继承,javascript构造函数

    一、什么是"非构造函数"的继承?

    比如,现在有一个对象,叫做"中国人"。

    复制代码 代码如下:
    var Chinese = { nation:'中国' };

    还有一个对象,叫做"医生"。

    复制代码 代码如下:
     var Doctor ={ career:'医生' }

    请问怎样才能让"医生"去继承"中国人",也就是说,我怎样才能生成一个"中国医生"的对象?

    这里要注意,这两个对象都是普通对象,不是构造函数,无法使用构造函数方法实现"继承"。

    二、object()方法

    json格式的发明人Douglas Crockford,提出了一个object()函数,可以做到这一点。

    function object(o) {
    
        function F() {}
    
        F.prototype = o;
    
        return new F();
    
      }
    

    这个object()函数,其实只做一件事,就是把子对象的prototype属性,指向父对象,从而使得子对象与父对象连在一起。

    使用的时候,第一步先在父对象的基础上,生成子对象:

    复制代码 代码如下:
      var Doctor = object(Chinese);

    然后,再加上子对象本身的属性:

    复制代码 代码如下:
      Doctor.career = '医生';

    这时,子对象已经继承了父对象的属性了。

    复制代码 代码如下:
      alert(Doctor.nation); //中国

    三、浅拷贝

    除了使用"prototype链"以外,还有另一种思路:把父对象的属性,全部拷贝给子对象,也能实现继承。

    下面这个函数,就是在做拷贝:

      function extendCopy(p) {
    
        var c = {};
    
        for (var i in p) {
          c[i] = p[i];
        }
    
        c.uber = p;
    
     return c; }
    

    使用的时候,这样写:

    复制代码 代码如下:
      var Doctor = extendCopy(Chinese);
      Doctor.career = '医生';
      alert(Doctor.nation); // 中国

    但是,这样的拷贝有一个问题。那就是,如果父对象的属性等于数组或另一个对象,那么实际上,子对象获得的只是一个内存地址,而不是真正拷贝,因此存在父对象被篡改的可能。

    请看,现在给Chinese添加一个"出生地"属性,它的值是一个数组。

    复制代码 代码如下:
      Chinese.birthPlaces = ['北京','上海','香港'];

    通过extendCopy()函数,Doctor继承了Chinese。

    复制代码 代码如下:
      var Doctor = extendCopy(Chinese);

    然后,我们为Doctor的"出生地"添加一个城市:

    复制代码 代码如下:
      Doctor.birthPlaces.push('厦门');

    发生了什么事?Chinese的"出生地"也被改掉了!

    复制代码 代码如下:
      alert(Doctor.birthPlaces); //北京, 上海, 香港, 厦门
      alert(Chinese.birthPlaces); //北京, 上海, 香港, 厦门

    所以,extendCopy()只是拷贝基本类型的数据,我们把这种拷贝叫做"浅拷贝"。这是早期jQuery实现继承的方式。

    四、深拷贝

    所谓"深拷贝",就是能够实现真正意义上的数组和对象的拷贝。它的实现并不难,只要递归调用"浅拷贝"就行了。

      function deepCopy(p, c) {
    
        var c = c || {};
    
        for (var i in p) {
    
          if (typeof p[i] === 'object') {
    
            c[i] = (p[i].constructor === Array) ? [] : {};
    
            deepCopy(p[i], c[i]);
    
          } else {
    
             c[i] = p[i];
    
          }
    }
    
        return c; }
    

    使用的时候这样写:

    复制代码 代码如下:
      var Doctor = deepCopy(Chinese);

    现在,给父对象加一个属性,值为数组。然后,在子对象上修改这个属性:

    复制代码 代码如下:
      Chinese.birthPlaces = ['北京','上海','香港'];
      Doctor.birthPlaces.push('厦门');

    这时,父对象就不会受到影响了。

    复制代码 代码如下:
      alert(Doctor.birthPlaces); //北京, 上海, 香港, 厦门
      alert(Chinese.birthPlaces); //北京, 上海, 香港

    目前,jQuery库使用的就是这种继承方法。

    以上所述就是本文的全部内容了,希望大家能够喜欢。

    一、什么是"非构造函数"的继承? 比如,现在有一个对象,叫做"中国人"。 复制代码 代码如下...

    javascript构造函数是什

    javascript本身是没有类的概念,只有函数的概念。javascript的类实际上也是一个javascript的函数,在这个特殊的函数中间可以包含变量和其他javascript函数的引用。那么这个特殊的函数本身就是javascript所谓类的构造函数。  

    本文由彩世界平台发布于新闻动态,转载请注明出处:Javascript 构造函数详解,javascript构造函数

    关键词: