亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

Prototype/Constructor

標簽:
架構

In my opinion, there are two big things in Javascript's world - Closure and Prototype.

Question 1.
What does Prototype do in JavaScript?

In a single word, it's a feature that aimed at reducing code duplication.
We all know in computer world there is a famous philosophy - Don't Repeat Yourself.
In classic object-oriented languages such as c++/c#/java, we have inheritance to encapsulate some common methods into a super class to reduce code lines.
But in JavaScript, there is no concept of Class, we use Function and Prototype concept to imitate the similar behavior.

Question 2.
Who owns the Prototype?

Function owns the prototype property, not object itself.
In JavaScript, all things are object(include function), so function can have it's own property.
In fact, every function has a prototype property, which is an Object.

Object created from function has a hidden link to the function's prototype object.
Functions created in this propose are called constructor function, which should start with a capital letter.
For example:

function User(name) {

    this.name = name;

}

User.prototype.getName = function() {

    return this.name;

};

var user = new User('Zhang San');

alert(user.getName());

In this example, User is a constructor function.
user is a instance of User which has privileges to access prototype method getName.

Questions 3.
Who create me?

Every object has a constructor property, which indicate the constructor function.
see this exmple:

function User(name) {

    this.name = name;

}

var user = new User('Zhang San');

alert(user.constructor === User); // true

alert(user.constructor.prototype === User.prototype); // true

alert({}.constructor === Object); // true

alert([].constructor === Array); // true

alert(''.constructor === String); // true

Because User.prototype is an object, it has constructor property:

alert(user.constructor.prototype.constructor); // User

we can redefine the constructor function's prototype like this:

function Person(sex) {

    this.sex = sex;

}

function User(name) {

    this.name = name;

}

User.prototype = new Person('man');


var user = new User('Zhang San');

alert(user.sex); // 'man'

alert(user.constructor); // 'Person'

Note that user.constructor is Person now, not User.
We can fix it using a trick:

function Person(sex) {

    this.sex = sex;

}

function User(name) {

    this.name = name;

}

User.prototype = new Person('man');

User.prototype.constructor = User;var user = new User('Zhang San');

alert(user.sex); // 'man'

alert(user.constructor); // 'User'

Question 4.
Object/Array are types?

You'd better think them as constructor functions, just like User has done.
Maybe there are definition in JavaScript core like this:

function Object() {

}

function Array() {

}

The pre-defined constructor functions have read-only prototypes.
For examples:

Array.prototype.max = function() {

    var maxValue = this[0];

        for (var i = 1; i < this.length; i++) {

            maxValue = this[i];

        }

    }

    return maxValue;

};

alert([2,33,25].max()); // 33
Array.prototype = {

    'max': function() {

        var maxValue = this[0];

        for (var i = 1; i < this.length; i++) {

                maxValue = this[i];

            }

        }

        return maxValue;

    }

};

alert([2, 33, 25].max()); // [2, 33, 25].max is not a function
點擊查看更多內容
TA 點贊

若覺得本文不錯,就分享一下吧!

評論

作者其他優質文章

正在加載中
  • 推薦
  • 評論
  • 收藏
  • 共同學習,寫下你的評論
感謝您的支持,我會繼續努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦
今天注冊有機會得

100積分直接送

付費專欄免費學

大額優惠券免費領

立即參與 放棄機會
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

舉報

0/150
提交
取消