JavaScript回顾(2)

Javascript面向对象基础知识 1、如何定义一个类，使用如下语法来创建一个类 function Person(name,age){ //习惯上第一个字母大写 //this修饰的变量称为属性 this .name=name; this .age=age; //如果属性是一个函数，则这个属性就是一个方法 this .play= func

Javascript面向对象基础知识

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

1.     function Person(name, age){ //习惯上第一个字母大写  
2.     //this修饰的变量称为属性  
3.     this.name = name;  
4.     this.age = age;  
5.     //如果属性值是一个函数，则这个属性就是一个方法  
6.     this.play = function(){  
7.         alert('play football...');  
8.     };  
9. }  

2、如何创建该类的实例

1. var p = new Person('zs', 22);  
2. p.play();  
3. p.name;  

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

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

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

1. var obj = new Object();  
2. obj.name = 'zs';  
3. obj.age = 22;  
4. obj.play = function(){  
5.     alert('play...');  
6. };  

(2)使用“json”语法

1. var p = {'name':'zs','age':22};  
2. var p = {'name':'zs','play':function(){  
3. alert('hello');  
4. };  

或者

1. var p = {name:'zs',age:22,marrid:false};  
2. var p = {name:'zs',play:function(){  
3.     alert('hello');  
4. }};  

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

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

1. var p = {name:'zs',  
2.     address:{  
3.         city:'beijing',  
4.         street:'ca'  
5.     }  
6. };  

一个完整的例子

1. html>  
2.     head>  
3.         script>  
4.             function f1(){  
5.                 //var p = {'name':'zs','age':22};  
6.                 //var p = {name:'zs',age:22,marrid:false};  
7.                 var p = {name:'zs',  
8.                     address:{  
9.                         city:'beijing',  
10.                         street:'ca'  
11.                     }  
12.                 };  
13.                 //alert(p.name);  
14.                 alert(p.address.city);  
15.             }  
16.             function f2(){  
17.                 var arr = [  
18.                     {'name':'zs','age':22},  
19.                     {'name':'ls','age':32}  
20.                 ];  
21.                 alert(arr[1].name);  
22.             }  
23.         script>  
24.     head>  
25.     body>  
26.         input type="button" value="click me" onclick="f2();"/>  
27.     body>  
28. html>