これについての私の理解は、常にそれを使うことができ、それを知ることができることだけでしたが、私はその本質を掘り下げていません。今回は、「JavaScript the Good Parts」について深く理解しています。 (すべてのデバッグはコンソール、ブラウザF12キーで見ることができます)
これを一緒に見てみましょう。
関数を宣言すると、各関数には2つの追加パラメーター(正式なパラメーター)が定義されています。1つはこれであり、もう1つは引数です。引数は、関数によって実際に受け入れられているパラメーターであり、クラスの配列です。私は議論の簡単な紹介だけを紹介します、そして、私たちはこのポインターに焦点を当てます。
オブジェクト指向の変換では、これは非常に重要であり、その値はコールのパターンに依存します。 JavaScriptには、合計に4つの呼び出しパターンがあります。メソッド呼び出しパターン、関数呼び出しパターン、コンストラクター呼び出しパターン、および適用呼び出しパターンです。
メソッド呼び出しモード
関数がオブジェクトとしての属性である場合、通常、この関数をこのオブジェクトのメソッドと呼びます。この方法が呼び出されると、これはメソッドが属するオブジェクトを指します。
コードコピーは次のとおりです。
<script type = "text/javascript">
var people = {
名前:「Yika」、
sayname:function(){
console.log(this.name); //「Yika」
//これは人々のオブジェクトに縛られています
}
}
people.sayname();
</script>
Chestnutが示すように、これはSayNameオブジェクトを指します。これを介してオブジェクトのコンテキストを取得するこの方法は、パブリック方法です。 (公開方法)
関数呼び出しモード
関数が呼び出された場合、オブジェクト上のメソッドではなく、関数と呼ばれます。
このパターン呼び出しは、この関数が外部関数で呼び出されたとしても、ウィンドウオブジェクトを指します。見てみましょう。
コードコピーは次のとおりです。
<script type = "text/javascript">
var name = "window-yika";
var people = {
名前:「People-yika」、
学生:function(){
console.log(this); //これは、ここでオブジェクトの人々にバインドします
function saysname(){
var name = "sayname-yika";
console.log(this.name); // window-yika
// sayname機能自体とそれが配置されている人のオブジェクトが名前の値を持っている場合でも、これはウィンドウを指します
};
sayname();
}
}
people.student();
</script>
この観点から、JavaScriptの「設計エラー」を解決する方法を知っていますか。
はい、これを学生関数、つまり6行目にキャッシュします。次に、変数を介してこれをSayName関数に転送して解決します。
コードコピーは次のとおりです。
var people = {
名前:「People-yika」、
学生:function(){
var self = this; //これをキャッシュします
function saysname(){
var name = "sayname-yika";
console.log(self.name); //「People-Yika」、この時点で、自己は人々のオブジェクトを指しています
};
sayname();
}
}
コンストラクターコールモード
JavaScriptがコンストラクターについて話すとき、「関数名は大文字です!呼び出すときに新しいオペレーターを使用してください!」コンストラクターの命名を標準化するために、関数名の大文字化は理解しやすいです。しかし、新しい使用する必要がある理由を掘り下げたことはありますか?新しい関数を新しい関数を呼び出すと、関数の背景が関数プロトタイプを指す新しいオブジェクトを作成し、これも新しいオブジェクトにバインドされます。 JavaScriptは、プロトタイプの継承に基づく言語です。プロトタイプのプロトタイプについてあまり明確ではない学生は、自分で情報をチェックできます。私はこれに焦点を合わせています。
まず、コンストラクターが一般的にどのように見えるかを見てみましょう。
コードコピーは次のとおりです。
<script type = "text/javascript">
function people(name){
this.name = name; //これはここで新しいオブジェクトyikaを指していますyikaを新しいものと呼んだ後
this.sayname = function(){
console.log(this.name); //出力
}
}
var yika = new People( "yika");
yika.sayname(); //「Yika」出力Yikaは新しいコールで取得されるため、これはYikaオブジェクトにバインドされています。
</script>
一見すると、理解するのは簡単ではないようです。なぜこれが機能のウィンドウを指していたのはなぜですか、そして今、あなたはキャッシュなしで人々の機能を指すことができますか?
それは問題ではありません。この関数は新しいと呼ぶことで密かに「悪いことをする」と言うだけではありませんでしたか?あなたがしたことを正確に見てみましょう。
コードコピーは次のとおりです。
<script type = "text/javascript">
function people(name){
var that = {}; //悪いこと1:自分でオブジェクトを生成します
that.name = name;
that.sayname = function(){
console.log(that.name);
};
それを返します。 //悪いもの2、あなたは戻りの動作を変更し、生成されたばかりのオブジェクトを返します
}
var yika = people( "yika"); //ここで新しいものを省略し、新しいオペレーターへの呼び出しを模倣することができます
yika.sayname(); //今のように「Yika」を出力します
</script>
このようにはっきりと見ることができます。 Newはオブジェクトを生成するだけでなく、オブジェクトを自動的に返すため、この新しいオブジェクトを自然に指します。
コンストラクターを呼び出すために新しい使用を忘れないでください。そうしないと、何か問題が発生しても警告はありません。すべての資本契約は依然として非常に必要です。
コールモードを適用します
Applyメソッドにより、呼び出し関数に渡されたパラメーターの配列を構築することができます。これにより、この値を変更することもできます。
function.Apply(このバウンド値、引数パラメーター配列)
私が言うことができることはたくさんあります、私はあなたが理解するのを助けるためにここにあなたに栗を与えるだけです:
コードコピーは次のとおりです。
<script type = "text/javascript">
function people(name){
this.name = name;
this.sayname = function(){
console.log(this.name); // SayNameメソッドは、People Constructorに属します
}
}
関数学生(名前){
people.Apply(これ、引数); //コンストラクターを借用する統合方法は、学生コンストラクターに適用して人々のコンストラクターに電話して、人々のこの価値を変更することです。
//このようにして、学生インスタンスが作成されるたびに、人々のコンストラクターは呼び出されます
}
var学生=新しい学生( "yika");
Student.sayname(); //出力 "yika"
</script>
このバインディングオブジェクトを適用して簡単に変更できます。適用と同様の呼び出しも同じ効果を持っています。興味のある学生は自分でそれを検索して学ぶことができます。
まあ、ついに、これの4つの呼び出しモードの変更が終了しました。メソッド呼び出しモードとコンストラクター呼び出しモードがさらに使用され、より重要になります。関数呼び出しモードの場合、そのトラップを回避することを学ぶ必要があります。
エラーがある場合は、時間内に報告してください。他の人の誤解を招くのを防ぐために、できるだけ早く修正します。ありがとう!