现在的位置: 首页 > 综合 > 正文

JavaScript回顾(2)

2018年05月20日 ⁄ 综合 ⁄ 共 1697字 ⁄ 字号 评论关闭

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>   



【上篇】
【下篇】

抱歉!评论已关闭.