Xiaoqiangs mobile HTML5-Entwicklungsstraße (27) – JavaScript-Rezension 2-HTML-Tutorial-php.cn

Xiaoqiangs mobile HTML5-Entwicklungsstraße (27) – JavaScript-Rezension 2

黄舟

Freigeben： 2017-02-04 14:16:14

Original

1327 Leute haben es durchsucht

Grundkenntnisse in objektorientiertem JavaScript

So definieren Sie eine Klasse und verwenden die folgende Syntax, um eine Klasse zu erstellen

 function Person(name, age){ //习惯上第一个字母大写  
    //this修饰的变量称为属性  
    this.name = name;  
    this.age = age;  
    //如果属性值是一个函数，则这个属性就是一个方法  
    this.play = function(){  
        alert(&#39;play football...&#39;);  
    };  
}

Nach dem Login kopieren

So erstellen Sie eine Instanz davon Klasse

var p = new Person(&#39;zs&#39;, 22);  
p.play();  
p.name;

Nach dem Login kopieren

3. Zwei weitere Möglichkeiten, Javascript-Objekte zu erstellen

(1) Erstellen Sie zuerst eine Instanz des Objekttyps und fügen Sie dann neue Eigenschaften und Methoden hinzu

JavaScript ist eine dynamische Sprache, die zur Laufzeit neue Eigenschaften und Methoden zu Objekten hinzufügen kann

var obj = new Object();  
obj.name = &#39;zs&#39;;  
obj.age = 22;  
obj.play = function(){  
    alert(&#39;play...&#39;);  
};

Nach dem Login kopieren

(2) Verwenden Sie die „json“-Syntax

  var p = {&#39;name&#39;:&#39;zs&#39;,&#39;age&#39;:22};  
ar p = {&#39;name&#39;:&#39;zs&#39;,&#39;play&#39;:function(){  
alert(&#39;hello&#39;);  
};

Nach dem Login kopieren

oder

var p = {name:&#39;zs&#39;,age:22,marrid:false};  
var p = {name:&#39;zs&#39;,play:function(){  
    alert(&#39;hello&#39;);  
}};

Nach dem Login kopieren

Wenn der Attributwert eine Zeichenfolge ist, muss er in Anführungszeichen (einfach oder doppelt) eingeschlossen werden

Der Attributwert erlaubt Zahl, Zeichenfolge, Boolescher Wert, Null, Objekt

var p = {name:&#39;zs&#39;,  
    address:{  
        city:&#39;beijing&#39;,  
        street:&#39;ca&#39;  
    }  
};

Nach dem Login kopieren

Ein vollständiges Beispiel

<html>  
    <head>  
        <script>  
            function f1(){  
                //var p = {&#39;name&#39;:&#39;zs&#39;,&#39;age&#39;:22};  
                //var p = {name:&#39;zs&#39;,age:22,marrid:false};  
                var p = {name:&#39;zs&#39;,  
                    address:{  
                        city:&#39;beijing&#39;,  
                        street:&#39;ca&#39;  
                    }  
                };  
                //alert(p.name);  
                alert(p.address.city);  
            }  
            function f2(){  
                var arr = [  
                    {&#39;name&#39;:&#39;zs&#39;,&#39;age&#39;:22},  
                    {&#39;name&#39;:&#39;ls&#39;,&#39;age&#39;:32}  
                ];  
                alert(arr[1].name);  
            }  
        </script>  
    </head>  
    <body>  
        <input type="button" value="click me" onclick="f2();"/>  
    </body>  
</html>

Nach dem Login kopieren

Das Obige ist der Inhalt von Xiaoqiangs HTML5-Entwicklungsstraße für Mobilgeräte (27) – JavaScript-Rezension 2 . Für weitere verwandte Inhalte folgen Sie bitte der chinesischen PHP-Website (www.php.cn)!