Rumah >hujung hadapan web >html tutorial > 小强的HTML5移动开发之路（27）—— JavaScript回顾2

小强的HTML5移动开发之路（27）—— JavaScript回顾2

黄舟asal: 2017-02-04 14:16:141430semak imbas

JavaScript面向对象基础知识

1、如何定义一个类，使用如下语法来创建一个类

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

2、如何创建该类的实例

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

3、创建javascript对象的另外两种方式

(1)先创建一个Object类型的实例，然后增加新的属性和方法

javascript是一种动态语言，可以在运行时为对象增加新的属性和方法

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

(2)使用“json”语法

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

或者

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

属性值如果是字符串必须用引号括起来(单双)

属性值允许number,string,boolean,null,Object

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

一个完整的例子

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

以上就是小强的HTML5移动开发之路（27）—— JavaScript回顾2的内容，更多相关内容请关注PHP中文网（www.php.cn）！

Kenyataan：

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel sebelumnya：小强的HTML5移动开发之路（26）—— JavaScript回顾1Artikel seterusnya：小强的HTML5移动开发之路（28）—— JavaScript回顾3

Artikel berkaitan

Lihat lagi