JavaScript初心者は必ず「new」を見ます.

3752 ワード

訳文:https://blog.fundebug.com/2017/06/02/javascript-new-for-beginner/
訳者は: この記事は簡単に紹介したnewです.プロトタイプを紹介します.読む価値があります.
原文: JavaScript For Beginner:the'new'operator
翻訳者: Fundebug
可読性を保証するために、本文は直訳ではなく意訳を採用する.また、この著作権は元の作者に帰属し、翻訳は学習にのみ使用されます.newを使うと、
新しい空のオブジェクトを作成します.thisをオブジェクトにバインドする.__proto__という新しい属性を追加し、構造関数のプロトタイプを指します.thisオブジェクトを返します.あなたが特に理解していないなら、次に例を使って詳しく説明します.まず、2つのパラメータStudentnameを受信する構造関数ageを定義する.
function Student(name,age){
this.name=name;
this.age=age;
)newを使って新しいオブジェクトを作成します.
var first=
new Student(
ジョンさん、
26)
いったい何があったのですか?
新しいオブジェクトを作成し、objと呼びます.thisobjに結合されており、thisのいずれかの対の参照はobjの参照である.__proto__属性はobjオブジェクトに追加される.obj.__proto__Student.prototypeを指す.objオブジェクトはfirst変数に割り当てられる.私たちはプリントテストに合格できます.
consolone.log(first.name);
//ジョン
consolie.logs(first.age)
//26
次に、__proto__がどういうことかを深く見てみます.
プロトタイプ(Prottotype)
どのJavaScriptオブジェクトにも原型があります.すべてのオブジェクトはその原型からオブジェクトと属性を継承します.
ブラウザ開発者コントロールパネル(Windows:Ctrl+Shift+J)(Mac:Cmd+Option+J)を開き、以前に定義されたStudent関数を入力します.
function Student(name,age){
this.name=name;
this.age=age;
)
各オブジェクトにプロトタイプがあることを確認するために、入力:
Student.prototype
//Object{…}
戻ってきた相手が見えます.新しいオブジェクトの定義を試みます.
var second=
new Student(
'Jeff'は、
50)
以前の説明によれば、secondが指すオブジェクトには__proto__属性があり、父を指すべきprototypeがあります.
second.__proto_==Student.prototype
//trueStudent.prototype.constructorStudentの構造関数を指します.印刷してみます.
Student.prototype.com nstructor;
//function Student(name,age){
//this.name=name;
//this.age=age
//}
事情はますます複雑になっているようです.私達は図でイメージして説明します.Studentのコンストラクタには.prototypeという属性があり、また.constructorの属性が逆にStudentに向けられて構成されている.それらはリングを構成しています.newを使用して新しいオブジェクトを作成すると、各オブジェクトは.__proto__属性を逆にStudent.prototypeに向ける.
このデザインは継承にとって重要です.プロトタイプオブジェクトはこのコンストラクタによって作成されたすべてのオブジェクトによって共有されるからです.モデルオブジェクトに関数と属性を追加すると、他のすべてのオブジェクトが使用できます.
本論文では2つのStudentオブジェクトしか作成していません.もし私たちが20,000個を作成したら、各オブジェクトの代わりに属性と関数をprototypeに置くと、非常に多くの記憶と計算リソースが節約されます.
例を見てみます.
Student.prototype.sayInfo=
function(){
consolie.log(
this.name+
'is'+
this.age+
'years old')
)Studentのプロトタイプに新しい関数を追加しました. – したがって、sayInfoを使用して作成された学生オブジェクトは、この関数にアクセスすることができます.
second.sayInfo()
//Jeff is 50 years old
新しい学生オブジェクトを作成し、再度テストします.
var third=
new Student(
'Tracy'
15)
//もし今プリントしたら、年齢と名前の二つの属性しか見えませんが、
//まだsayInfo関数にアクセスできます.
サード
//Student{name:「Tracy」、age:15}
third.sayInfo()
//Tracy is 15 years old
JavaScriptでは、まず現在のオブジェクトがこの属性を持っているかどうかを確認します.もしないなら、原型の中にこの属性があるかどうかを見ます.この規則は、属性を見つけることに成功するまで、または最上位のグローバルオブジェクトが見つからずに失敗します.
これを引き継ぎます.普段はStudent関数を定義する必要がなく、直接使用できます.toString()はこの関数がtoString()のプロトタイプに内蔵されているからです.各オブジェクトは最終的にObjectを指すので、Object.prototypeを呼び出すことができます.もちろん、この関数を書き換えることもできます.
var name={
toString:
function(){
consolie.log(
'Not a good idea');
)

name.toString()
//Not a good idea
作成されたtoString()オブジェクトは、まずnameがあるかどうかを確認し、ある場合はプロトタイプ内で検索しない.
締め括りをつける
これらの概念はあなたにとってちょっと多いかもしれませんが、原型を使うともっと効率的なコードが書けるようになります.