JavaScript学习笔记（三）——对象

第四章理解对象

1 说明

　　对象的状态：属性，行为：方法；

　　对象定义放在花括号内；

　　用冒号分隔属性名和属性值；

　　用逗号分隔属性名和属性值对，包括方法；

　　最后一个属性值后面不加逗号；

　　属性名可以是任何字符串，但通常遵循变量命名规则，包含空格时必须用引号将其括起来；

　　同一个对象中不能包含两个同名的属性；

　　句点表示法访问对象，当然也可以用方括号方法（更为灵活且需注意无逗号）；

　　添加新属性：指定新属性并赋值：fiat.needsWashing=true;

　　删除属性：delete fido.dogYears;（删除成功返回true）;

　　创建一个无属性的对象: var lookMaNoProps={ };

　　将对象信息显示到控制台: console.log(fiat);

　　函数中传递的是对象的引用，因此在函数中对对象的修改有效；

2 实例1:

 1 <script language="JavaScript" type="text/JavaScript">
 2 function getSecret(file,secretPassword)
 3 {
 4 file.opened=file.opened+1;
 5 if(secretPassword==file.password)
 6 return file.contents;
 7 else
 8 return "Invalid password! No secret for you.";
 9 }
10 function setScret(file,secretPassword,secret)
11 {
12 if(secretPassword==file.password)
13 {
14 file.opened=0;
15 file.contents=secret;
16 }
17 }
18 var superSecretFile={
19 level:"classifiled",
20 opened:0,
21 password:2168,
22 contents: "Dr. Evel's next meeting is in Detroit."
23 };
24 var secret=getSecret(superSecretFile,2168);
25 console.log(secret);
26 var secret1=getSecret(superSecretFile,2152);
27 console.log(secret1);
28 setScret(superSecretFile,2168,"Dr . Evel's next meeting is in Philadelphia");
29 secret=getSecret(superSecretFile,2168);
30 console.log(secret);
31 </script>

3 实例2：

  1 <!doctype html>
  2
  3 <html lang="en">
  4
  5 <head>
  6
  7 <title>Battleship</title>
  8
  9 <meta charset="utf-8">
 10
 11 </head>
 12
 13 <body>
 14
 15 <script language="JavaScript" type="text/JavaScript">
 16
 17 function makeCar()
 18
 19 {
 20
 21 var makes=["Chevy","GM","Fiat","Webville Motors","Tucker"];
 22
 23 var models=["Cadillac","500","Bel-Air","Taxi","Torpedo"];
 24
 25 var years=[1955,1957,1948,1954,1961];
 26
 27 var colors=["red","blue","tan","yellow","white"];
 28
 29 var convertile=[true,false];
 30
 31
 32
 33 var rand1=Math.floor(Math.random()*makes.length);
 34
 35 var rand2=Math.floor(Math.random()*models.length);
 36
 37 var rand3=Math.floor(Math.random()*years.length);
 38
 39 var rand4=Math.floor(Math.random()*colors.length);
 40
 41 var rand5=Math.floor(Math.random()*5)+1;
 42
 43 var rand6=Math.floor(Math.random()*2);
 44
 45
 46
 47 var car={
 48
 49 make:makes[rand1],
 50
 51 model:models[rand2],
 52
 53 year:years[rand3],
 54
 55 color:colors[rand4],
 56
 57 passengers:rand5,
 58
 59 convertile:convertile[rand6],
 60
 61 mileage:0,
 62
 63 fuel:0,
 64
 65 started:false,
 66
 67
 68
 69 start:function(){
 70
 71 this.started=true;
 72
 73 },
 74
 75 stop:function(){
 76
 77 this.started=false;
 78
 79 },
 80
 81 drive:function(){
 82
 83 if(this.started)
 84
 85 {
 86
 87 if(this.fuel>0)
 88
 89 alert("Zoom zoom!");
 90
 91 else
 92
 93 {
 94
 95 alert("Uh , oh ,out of fuel!");
 96
 97 this.stop();
 98
 99 }
100
101 }
102
103 else
104
105 alert("You need to start the engine first!");
106
107 },
108
109 addFuel:function(amount){
110
111 this.fuel+=amount;
112
113 }
114
115 };
116
117 return car;
118
119 }
120
121 function displayCar(car)
122
123 {
124
125 console.log("Your new car is a "+car.year+" "+car.make+" "+car.model);
126
127 }
128
129 var Cadillac=makeCar();
130
131 displayCar(Cadillac);
132
133 //访问对象中的属性
134
135 //方法一：迭代器
136
137 for(var pup in Cadillac)
138
139 {
140
141 console.log(pup+" : "+        Cadillac[pup]);
142
143 }
144
145 //方法二：句点访问法和方括号访问法
146
147 console.log("You new car 's color is "+Cadillac.color);
148
149 console.log("Your car counld hold "+Cadillac["passengers"]+" people.");
150
151 console.log("Your car counld hold "+Cadillac["passe"+"ngers"]+" people.");
152
153
154
155 Cadillac.drive();//开车
156
157 Cadillac.start();//启动
158
159 Cadillac.drive();//开车
160
161 Cadillac.addFuel(15);//加油
162
163 Cadillac.start();//启动
164
165 Cadillac.drive();//开车
166
167 Cadillac.stop();//熄火
168
169 Cadillac.drive();//开车
170
171 </script>
172
173 </body>
174 </html>

4 对象拓展

　　JavaScript提供：

　　Date， Math， RegExp(字符串中查找)， JSON(与其他应用程序交换js对象)

　　浏览器提供：

　　Doucument(写入网页)，Windows(，与浏览器相关)，Console(与控制台相关)

未名

JavaScript学习笔记（三）——对象

1 说明

2 实例1:

3 实例2：

4 对象拓展