Hinweise zur JavaScript-Objektstudie

Objekte sind die Grundeinheit von JavaScript. In JS ist eigentlich alles ein Objekt, und seine Funktion ist nicht nur sehr leistungsfähig, sondern hat auch unterschiedliche Funktionen.

1. Referenz

Das Konzept der Referenz ist eine der Grundlagen von JS. Es ist ein Hinweis auf den tatsächlichen Standort eines Objekts. Siehe das Beispiel unten:

var items = new Array("abc","def","hig");
//创建此数组的引用
var Ref = items;
items.push("klm");
alert(Ref.lenth);  //此处应该显示4

Wenn es sich jedoch um eine Zeichenfolge handelt, tritt eine andere Situation auf. Siehe den Code unten:

var items = "abc";
var Ref = items;
items += "def";  //这里创建了一个新对象，而非原对象的修改。

Jetzt zeigen Ref und Elemente auf unterschiedliche Punkte . Objekt.

2. Funktionsüberladung

Jede Funktion in JS hat ein Variablenargument, das ein Pseudo-Array ist, das alle Parameter empfängt. Warum „Pseudo“, weil man es nicht ändern kann, aber es hat eine Längeneigenschaft. Schauen wir uns das folgende Beispiel an:

function  myFun(num1,num2)
{
    if(arguments.length == 2) { alert("我有两个参数"); }
    if(arguments.length == 1) { alert("我有一个参数"); }
}

Als nächstes rufen wir die Funktion myFun("abc"); myFun("abc","def"); auf Die Sache ist, das ist ursprünglich Funktionsüberladung :)

3. Geltungsbereich

In JavaScript wird der Geltungsbereich durch Funktionen unterteilt, nicht durch Blöcke (while, if, for). Dies kann beim Verständnis einiger Codes zu Problemen führen. Um die Details zu veranschaulichen, schauen wir uns das folgende Beispiel an:

var temp="oldTemp"    //全局变量
if(true)
{
    var temp = "newTemp"   //这里还在全局中
}
alert(temp == "newTemp")   //发现相等

Aber wenn wir die temporäre Variable in einer Funktion deklarieren und ändern, ist die Wirkung völlig anders, siehe Beispiel:

var temp="oldTemp" ;   //全局变量
function test()
{
    var temp = "newTemp";
}
test();
alert(temp == "newTemp") ;  //发现不相等

In JS ist eine globale Variable ein Attribut des Fensterobjekts. Im obigen Beispiel ist die globale Variable temp == window.temp. Es ist auch zu beachten, dass eine bestimmte Variable automatisch zu einer wird eine globale Variable, obwohl sie höchstwahrscheinlich nur innerhalb einer bestimmten Funktion verwendet wird.

4. Abschluss

Abschluss bedeutet, dass die innere Funktion auf die Variablen in der sie umgebenden Funktion verweisen kann, auch wenn die äußere Funktion beendet wurde. Siehe das Beispiel unten:

function AddNum(num1)
{
    return function (num2)
    {
        return num1 + num2;
    }
}
var temp = AddNum(4);          //传入第一个参数，然后AddNum消失
var temp2 = temp(5);           //传入第二个参数，然后相加，返回9
alert(temp2);

Dieses Beispiel verkörpert das Konzept der Schließung sehr gut. Es ist ein Sonderfall und wird sicherlich nicht auf diese Weise verwendet.

5. Kontextobjekt

Das Kontextobjekt wird durch diese Variable widergespiegelt, die immer auf das Objekt verweist, in dem sich der aktuelle Code befindet. Siehe den Code unten:

var obj ={
    yes:function(){
        this.val = true;
    },
    no:function(){
        this.val = false;
    }
}
alert(obj.val == null);   //这里我们发现对象obj没有val属性
obj.yes();                     //执行yes函数，obj有了val属性
alert(obj.val == true);
 
window.no = obj.no     //把obj的no函数传给window对象
window.no();
alert(obj.val == true) ;  //发现没有变化
alert(window.val == false)   //window里的val变为false;

Es ist hier nicht leicht zu verstehen, JS stellt uns die Call-Methode zur Verfügung. Siehe das Beispiel unten:

function changeColor(color)
{
    this.style.color = color;
}
changeColor("Red");    //这里不行，因为window对象没有style属性
var temp = document.getElementById("temp");
changeColor.call(temp,"White");  //这里注意call的用法

Die Aufrufmethode legt das Kontextobjekt als ersten Parameter und die anderen Parameter als Parameter der ursprünglichen Funktion fest.

6. Objekte

An diesem Punkt sind wir gerade erst in das Thema eingestiegen, aber mit den vorherigen Konzepten gibt es in diesem Stück eigentlich nicht viel Inhalt. Schauen wir uns das Beispiel direkt an:

var obj = new Object();    //创建一个对象obj
obj.val = 5;               //创建属性obj，并为其赋值
obj.click = function()     //创建函数
{
    alert("我被单击了");
}

Der obige Code entspricht dem folgenden Code:

var obj = {
    val : 5,
    click: function(){
        alert("我被单击了");
    }
}

Im Gegensatz zu anderen objektorientierten Sprachen verfügt JS nicht über das Konzept der Klasse In Sprachen müssen wir grundsätzlich eine Instanz einer bestimmten Klasse instanziieren, in JS ist der Ansatz jedoch anders: Jede Funktion kann als Objekt instanziiert werden. Wir erstellen zunächst ein einfaches Objekt:

function User(name)
{
    this.name = name;
}
var temp = new User("张三");
alert(temp.name);

Was passiert, wenn das obige Objekt User nur als Funktion verwendet wird?

User("只作为函数使用");
alert(window.name);

Der Kontext davon wird zum Fensterobjekt.

7. Objektmethoden

Öffentliche Methoden sind für Endbenutzer im Kontext des Objekts zugänglich. Hier müssen wir das Prototypattribut verstehen. Siehe den Code unten:

function User(name,age)
{
    this.name = name;
    this.age = age;
}
User.prototype.getName = function(){ return this.name};
var user = new User("张三",25);
alert(user.getName());

Wir können öffentliche Methoden auch dynamisch erstellen, siehe Code unten:

function User(name,age)
{
    this.name = name;
    this.age = age;
    this.getName = function(){ return this.name};
}
 
var user = new User("张三",25);
alert(user.getName());

Dynamisch generierte Methoden werden nicht erstellt, wenn der Code zum ersten Mal kompiliert wird. Diese Technik dient dazu, Prototypen teurer, aber auch leistungsfähiger und flexibler zu machen.

Das Obige ist der Inhalt der JavaScript-Objekt-Lernnotizen. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!