Detaillierte Einführung der Funktionen apply() und call()

Dieser Artikel bietet Ihnen eine detaillierte Einführung in die Funktionen apply() und call(). Er hat einen gewissen Referenzwert. Ich hoffe, er wird Ihnen hilfreich sein.

Einführung in das Anwenden und Aufrufen von Funktionen

Wenn es um das Anwenden und Aufrufen von Funktionen geht, müssen wir zunächst über ihre Herkunft mit Funktionen sprechen

Javascript-Funktionen sind sowohl Objekte als auch Objekte

Es unterscheidet sich nicht von anderen JavaScript-Objekten. Und jede Funktion enthält zwei nicht geerbte Methoden apply() und call() Beide Methoden können die Funktion

indirekt aufrufen und diese beiden Methoden ermöglichen die Anzeige dieses Werts nach dem angegebenen Funktionsaufruf.

In Bezug auf den Wert davon ist der Wert verwirrend, da der Wert davon beim Eintritt in die Ausführungskontextphase bestätigt wird. Aber wir können den erforderlichen Wert explizit angeben, wenn die Funktion über apply() und call() aufgerufen wird.

Wofür werden also die Apply- und Call-Methoden verwendet?

Jeder Funktion kann beim Aufruf dieser Wert zugewiesen und als Methode des Objekts aufgerufen werden, auf das sie zeigt.

Das bedeutet, dass jede Funktion von jedem Objekt aufgerufen werden kann. Dies ist das ultimative Ziel der Apply- und Call-Methoden.

Nehmen wir zum Verständnis ein Anwendungsbeispiel

function f() {
    console.log(1);
}
f.call(); //1
f.apply(); //1

Oben verwenden wir animal.other (denken Sie darüber nach, was es ist, ja, es ist im Wesentlichen auch eine Funktion) als Hundeobjektmethode Anruf. Als nächstes verwenden wir einige praktische Argumente.

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);

Für apply() und cal() werden alle ersten Argumente, die an sie übergeben werden, zum Wert von this,

, null, undefiniert. Und wenn der erste übergebene tatsächliche Parameter undefiniert oder null ist, wird er im ES3- und nicht-strikten Modus durch das globale Objekt und

ersetzt. 哪怕传入的实参是原始值其它的原始值则会被相应的包装对象所替代Für Laien ist es Js egal, was der erste Parameter von apply/call ist. Die Funktion wird trotzdem aufgerufen, aber ob der Aufruf einen Fehler meldet, ist eine andere Sache.

//设置一个类数组对象
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);

Um sich genau an diese beiden Methoden zu erinnern und zu wissen, wann diese beiden Methoden verwendet werden sollten, listen Sie einige häufige Verwendungen auf

Zunächst einmal wird der Leistungsunterschied zwischen diesen beiden Methoden vorerst fast ignoriert, also wie Verwenden Sie sie?

Die Methode apply() ist für die Übergabe des zweiten Parameters geeignet und die Parameter sind unsicher. Verwenden Sie die Methode apply, z. B. die Argumente einer Funktion Das Objekt eignet sich sehr gut zur Übergabe als Parameter.

var str = '我是一个函数';
//将字符串传入,但是String对象无法调用slice属性 报错
Array.prototype.pop.call(str);

Ein weiteres Beispiel ist das Anhängen von Elementen an das Array

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();

Übergeben Sie auf ähnliche Weise das arr2-Array als Parameter.

Für ungeordnete Parameter, die nicht miteinander in Zusammenhang stehen, verwenden Sie call()

, um die Maximal- und Minimalwerte des Arrays zu erhalten

var arr1 = [1, 2, 3];
var arr2 = [66, 99, 131];
Array.prototype.push.apply(arr1, arr2);
console.log(arr1);

arr selbst hat keine mathematische Methode, aber wir können call oder apply verwenden, um seine Methode

zu verwenden, um den spezifischen Typ des erhaltenen Objekts

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);

zu bestimmen bei Verwendung typeof Die Ergebnisse sind alle Objekte, und es ist unmöglich zu bestimmen, um welchen Typ es sich handelt. Sie können also Object.prototype.toString.call() verwenden, um den spezifischen Typ abzurufen. Voraussetzung ist natürlich, dass die toSting()-Methode nicht überschrieben wurde

Array-ähnliches Objekt in ein echtes Array umwandeln

, normalerweise verwenden wir Array.prototype.slice.call( ) umzuwandeln

//验证对象的具体类型
var arr = [];
var type = Object.prototype.toString.call(arr);
console.log(type);// [object Array]

Natürlich

.

splice,concat也可以将类数组对象转数组Lasst es uns hier bekannt machen

.

Greifen Sie über den Index auf das Element zu und verfügen Sie über das Längenattribut. 类数组对象 Mit anderen Worten: Zwei Bedingungen müssen erfüllt sein: 1. Verwenden Sie die Seriennummer, um das Attribut zu definieren. 2. Verfügen Sie über das Längenattribut. Der Attributwert ist der Anzahl der Elemente
Bei Verwendung der Seriennummer Bei der Definition von Attributen wird empfohlen, die Attribute in der Reihenfolge beginnend mit 0 zu definieren. Andernfalls ist das Array-Element leer

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]'

Dieser Artikel ist hier drüben. Weitere spannende Inhalte finden Sie in der Spalte JavaScript-Video-Tutorial

auf der chinesischen PHP-Website!

Das obige ist der detaillierte Inhalt vonDetaillierte Einführung der Funktionen apply() und call(). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!