この記事では、apply() 関数と call() 関数について詳しく説明します。これには一定の参考値があります。必要な友人は参照してください。お役に立てば幸いです。
関数の適用と呼び出しの概要
適用と呼び出しに関しては、まず関数の起源について話さなければなりません
Javascript 関数は両方ともオブジェクトです
他の JavaScript オブジェクトと何ら変わりはありません。各関数には 2 つの非継承メソッド apply() と call() が含まれており、どちらも関数
を間接的に呼び出すことができます。例:
function f() { console.log(1); } f.call(); //1 f.apply(); //1
そして、これら 2 つのメソッドそれぞれのメソッドで表示が可能になります。指定された関数呼び出し後の this 値。
thisの値については、実行コンテキストステージに入るときにthisの値が確定するため、わかりにくいです。ただし、apply() および call() を通じて関数が呼び出されるときに、必要な this 値を明示的に指定できます。
それでは、apply メソッドと call メソッドは何に使用されるのでしょうか?
任意の関数は、呼び出されるときにこの値を割り当てることができ、this が指すオブジェクトのメソッドとして呼び出すことができます。
つまり、任意の関数を任意のオブジェクトから呼び出すことができ、これが apply メソッドと call メソッドの最終目標です。
理解するために使用例を見てみましょう
function Animal() {}; Animal.prototype = { constructor: Animal, other: function() { console.log('这是一只' + this.name); } } var animal = new Animal(); //定义一个对象 var dog = { name: '狗' }; //我的dog对象想使用Animal函数的other方法怎么办,使用call或apply animal.other.call(dog); animal.other.apply(dog);
上記では、animal.other (これが何であるか考えてみてください。そう、本質的には関数です) を犬オブジェクトのメソッドとして使用しています。電話。
//设置一个类数组对象 var arrLike = { 0: '我是apply', 1: '我是call', length: 2 } //将Arrar的slice函数的this显式指向arrLike,并将0作为参数传入slice函数 var newArr = Array.prototype.slice.call(arrLike, 0); //等价于 arrLike.slice(0); console.log(newArr);
apply() と cal() の場合、それらに渡される最初の引数はすべて this の値になります、渡された引数が元の値であっても
、null、未定義。そして、渡された最初の実パラメータが未定義または null の場合、ES3 および非厳密モードのグローバル オブジェクトに置き換えられ、他の元の値は対応するラッパー オブジェクト
に置き換えられます。
平たく言えば、Js は apply/call の最初のパラメータが何であるかを気にしません。関数は引き続き呼び出されますが、呼び出しでエラーが報告されるかどうかは別の問題です。
var str = '我是一个函数'; //将字符串传入,但是String对象无法调用slice属性 报错 Array.prototype.pop.call(str);
これら 2 つのメソッドを深く覚え、どのような場合にこれら 2 つのメソッドを使用するかを説明するために、いくつかの一般的な使用法をリストします。
まず、今のところ、これら 2 つのメソッドのパフォーマンスの違いはほとんど無視されています。
apply() メソッドは、2 番目のパラメータを順番に渡すのに適しており、パラメータは不確かです。関数の引数などの apply メソッドを使用してください。この配列のようなオブジェクトパラメータとして渡すのに非常に適しています。
function A(a, b, c) { console.log(a, b, c); } var fn = (function(func, b, c) { var args = arguments; return () => { func.apply(null, args); } }(A, 66, 99)); fn();
別の例は、要素を配列に追加することです
var arr1 = [1, 2, 3]; var arr2 = [66, 99, 131]; Array.prototype.push.apply(arr1, arr2); console.log(arr1);
同様に、arr2 配列をパラメーターとして渡します。
互いに関連性のない順序なしパラメータの場合は、call()
を使用して配列の最大値と最小値を取得します
var arr = [0, 1, 2, 3, 4]; //获取最大数 var max1 = Math.max.apply(Math, arr), max2 = Math.max.call(Math, 0, 1, 2, 3, 4), //获取最小数 min1 = Math.min.apply(Math, arr), min2 = Math.min.call(Math, 0, 1, 2, 3, 4); console.log(max1, max2, min1, min2);
arr 自体には Math メソッドはありませんが、call または apply を使用してそのメソッドを使用できます。
オブジェクトの特定のタイプを決定します。
//验证对象的具体类型 var arr = []; var type = Object.prototype.toString.call(arr); console.log(type);// [object Array]
取得時期typeof を使用すると、結果はすべてオブジェクトであり、どの型であるかを判断することはできません。したがって、Object.prototype.toString.call() を使用して特定の型を取得できます。もちろん、toSting() メソッドがオーバーライドされていないことが前提です。
配列のようなオブジェクトを実際の配列に変換します。通常は Array.prototype.slice.call( ) を変換します
var arrLike = { length: 3, 0: '值1', 1: '值2', 2: '值3' } var newArr = [].__proto__.slice.call(arrLike); var type = Object.prototype.toString.call(newArr); console.log(newArr, type); //[ '值1', '值2', '值3' ] '[object Array]'
もちろん、splice,concat は配列のようなオブジェクトを配列に変換することもできます
.
これは配列のようなオブジェクトの普及です
。
インデックスを介して要素にアクセスし、長さ属性を持つ
つまり、2 つの条件を満たす必要があります。1. シリアル番号を使用して属性を定義する。2. 長さ属性を持つ。属性値は要素の数である。
連番を使用する場合 属性を定義する場合は、0 から順に属性を定義することを推奨します。それ以外の場合、配列要素は空になります
var arrLike = { length: 3, 0: '值1', 1: '值2', 3: '值3' } var newArr = [].__proto__.slice.call(arrLike); var type = Object.prototype.toString.call(newArr); console.log(newArr, type); //[ '值1', '值2', empty] [object Array]
この記事はここで終了です。さらに興味深いコンテンツについては、PHP 中国語 Web サイトのJavaScript ビデオ チュートリアル列に注目してください。
以上がapply() 関数と call() 関数の詳細な紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。