Wie verwende ich JavaScript-Funktionen? Einführung in die Eigenschaften und Methoden von JavaScript-Funktionen-js-Tutorial-php.cn

Was ist eine JavaScript-Funktion? Funktionen in JavaScript sind eigentlich Objekte, da jede Funktion eine Instanz des Funktionskonstruktors ist und über die vom Funktionskonstruktor definierten Eigenschaften und Methoden verfügt. Schauen wir uns die Eigenschaften und Methoden von JavaScript-Funktionen genauer an.

Der Funktionsname ist tatsächlich ein Zeiger auf das Funktionsobjekt. Siehe den folgenden Code:

    function sum(a,b) {
        return a + b;
    }
    // 相当于把sum的引用地址传递给sum2。
    // 注意：不带圆括号的函数名是访问函数指针，而非调用函数
    var sum2 = sum; 
    sum2(1,2) // 3
    sum = null;
    sum(2,3) // undefined // 将sum的内存回收，即sum的引用地址变了
    sum2(2,3) //5 // 但sum2 还是指向原来的内存地址

Nach dem Login kopieren

Der obige Code kann das Problem veranschaulichen, dass der Funktionsname tatsächlich ein Zeiger auf das ist Funktionsobjekt. Nachdem wir die oben genannten Probleme verstanden haben, können wir die folgende Analyse durchführen:

Keine Überlastung

Nachdem wir das oben Gesagte verstanden haben, laden Sie es neu Das Laden entspricht einer erneuten Änderung des Referenzwerts der Funktionsvariablen, sodass der vorherige Wert später überschrieben wird, was leicht zu verstehen ist.

2. Funktionsförderung

Tatsächlich ähnelt es der Variablenförderung. Es ist der Unterschied zwischen deklarativen Funktionen und ausdrucksdefinierten Funktionen . Es ist ganz einfach

3. Funktion als Wert

Da der Funktionsname selbst eine Variable ist, kann er als Wert übergeben werden . Hier ist ein gutes Beispiel. Es ist auch eine gute Programmieridee, wie folgt:

function getSomeFunction(fn,arg) {
    return fn(arg);
} 
function add(num) {
    return num + 10;
}
function getGreeting(name) {
    return `Hello ${name}`;
}
getSomeFunction(add,5) // 15
getSomeFunction(getGreeting,'andy') // Hello andy

Nach dem Login kopieren

Sie können auch eine andere Funktion von einer Funktion zurückgeben. Wenn wir beispielsweise einige Sortiermethoden oder Iterationsmethoden von Arrays verwenden, können wir diesen Parameter mit der Methode „Externe Funktionsrückgabefunktion“ schreiben, da es sich bei der übergebenen Funktion um eine Funktionsvariable handelt Die zurückgegebene Funktion kann die Parameter übergeben, die wir für die Berechnung „speziell angeben“ möchten. Beispielsweise ist der Parameter der Sortierfunktion

// 规定利用哪个属性进行排序，如果不填则代表数组从大到小排序
function sortArgFuntion(compareProperty) { //compareProperty是上文中特定想要规定的参数

    return function (val1, val2) {
        if (compareProperty === undefined) {  // 如果排序的是数组的值，则用常规的方法
            if (val1 > val2) {
                return 1;
            } else if (val1 < val2) {
                return -1;
            } else {
                return 0;
            }
        } else {    // 如果排序的是对象的属性则用该方法
            if (val1[compareProperty] > val2[compareProperty]) {
                return 1;
            } else if (val1[compareProperty] < val2[compareProperty]) {
                return -1;
            } else {
                return 0;
            }
        }

    }
}
var data = [{
    name: 'andy',
    age: 25
}, {
    name: 'Nf',
    age: 29
}]
data.sort(sortArgFuntion('name'))

Nach dem Login kopieren

eine Funktion, die zum Neuordnen des Arrays verwendet wird. Und wenn wir die Funktionsparameter herausnehmen, können wir diese Funktion intuitiver und mit höherer Wiederverwendbarkeit schreiben, um den gewünschten Effekt zu erzielen. Gleichzeitig müssen Sie das Wesen und die Einzigartigkeit der Funktion Rückgabefunktion sorgfältig studieren und verstehen

Interne Eigenschaften der Funktion

Es gibt zwei spezielle Eigenschaften innerhalb der Funktionsvariablen

Argumente
dies

Argumente

Es ist ein Array-ähnliches Objekt. Was ist ein Array-ähnliches Objekt? Der Zugriff im Array-Stil kann über Seriennummern erfolgen (z. B. obj [1]), und es gibt ein Längenattribut (wenn Sie das Längenattribut des Objekts nicht definieren, hat es nur die Länge des Klassenarrays). der Indexwert und die Länge und verfügt nicht über verschiedene Methoden des Arrays. Wenn Sie also eine Array-Methode wie ein Array aufrufen möchten, müssen Sie Array.prototype.method.call verwenden, um

dies

Dies ist ein Wissenspunkt, der in JavaScript sehr verwirrend und kompliziert ist. Was er darstellt, hängt vollständig vom Aufrufort ab. Ich werde ihn in diesem Artikel zusammenfassen, aber auflisten. z.B:

window.color = 'red';
var o = {color:"blue"};
function sayColor() {
    console.log(this.color)
}
sayColor(); // red 因为调用位置是全局
o.sayColor = sayColor;
o.sayColor(); // blue 因为调用位置是o的对象里

Nach dem Login kopieren

Aus dem obigen Beispiel müssen wir wissen, dass der Funktionsname nur ein Zeiger ist, obwohl die Ausführungsumgebung unterschiedlich ist, das globale sayColor() und das o.sayColor() im Funktionspunkt zur gleichen Funktion.

Aufrufer

Neu hinzugefügt in es5, gibt es die aufrufende Umgebung der aktuellen Funktion zurück (muss eine Funktion sein, kein Objekt). Die aufrufende Umgebung ist global, null wird zurückgegeben. Es gibt zwei Verwendungsmöglichkeiten, eine ist der Funktionsname plus Aufrufer, die andere ist arguments.callee.caller

    function outer() {
        console.log(outer.caller); //null
        inner();
    };
    function inner() {
        console.log(inner.caller); // outer里的代码
    }

Nach dem Login kopieren

5 Funktionsattribute und Methoden

Da Funktionen auch Objekte sind, haben sie auch Eigenschaften und Methoden: Länge und Prototyp. Länge bezieht sich auf die Anzahl der in

function add(num1,num2) {} console.log(add.length) // 2

propertype

Bei Referenztypen ist propertype der tatsächliche Ort, an dem alle Instanzmethoden gespeichert werden.

Beim Erstellen benutzerdefinierter Referenztypen und beim Implementieren der Vererbung werden dessen Rolle und Schlüssel berücksichtigt (wie viele wichtige Punkte sind noch nicht verstanden, insbesondere das Wort Vererbung:)) In es5 ist der Eigenschaftstyp nicht aufzählbar und kann daher nicht durchlaufen werden .

apply() und call()

Zwei Parameter, der erste Parameter ist der Bereich, in dem ausgeführt werden soll, und der zweite Parameter apply ist das eingehende Array Oder das Argumente Objekt, Aufruf übergibt jeden Wert und der Rest ist genau gleich. Dies ist eines der Beispiele, um die Rolle von apply und call zu veranschaulichen:

    var color = "red";
    var o = {color:"blue"};
    function sayColor() {
        alert(this.color)
    }
    sayColor(); // red
    sayColor.call(this); // red 
    sayColor.call(window); // red
    sayColor.call(o); // blue

Nach dem Login kopieren

Wenn wir call nicht verwenden, müssen wir Folgendes tun:

    var color = "red";
    var o = {color:"blue"};
    function sayColor() {
        alert(this.color)
    }
    o.sayColor = sayColor;
    o.sayColor(); //blue

Nach dem Login kopieren

Der Vergleich ist also unter zu sehen Auf einen Blick. Die größte Rolle des Aufrufs besteht darin, Objekte und Methoden zu entkoppeln.

Bind-Methode

Die Bind-Methode wird verwendet, um eine Instanz einer Funktion zu erstellen Dieses Objekt zeigt auf den durch bind angegebenen Bereich.

Zum Beispiel:

    var color = "red";
    var obj = {color:"blue"}
    function sayColor() {
        console.log(this.color);
    }
    var bindSayColor = sayColor.bind(obj);
    bindSayColor(); // blue

Nach dem Login kopieren

Empfohlene verwandte Artikel:

Javascript-Funktion

Javascript-normale Funktionen und Konstrukte Der Unterschied zwischen Funktionen

Detaillierte Erklärung der Funktionsdeklaration und des Aufrufs in JavaScript

Das obige ist der detaillierte Inhalt vonWie verwende ich JavaScript-Funktionen? Einführung in die Eigenschaften und Methoden von JavaScript-Funktionen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!