整理了一下JS的基础语法，这里做下记录。
1 <!--Js的三大模块：ECMAScript(基本语法)、DOM(Document Object Model：文档对象模型，用于操作页面元素)、BOM(Browser Object Model：浏览器对象模型，用于操作浏览器)-->
2 <html>
3 <head>
4 <meta charset="utf-8"> <!--设置html界面采用utf-8字符集-->
5 <title>js的基本语法（ECMAScript）</title>
6
7 <!--内部JavaScript-->
8 <script type="text/javascript">
9 /*js中变量类型有：Number(数字类型)、String(字符串类型)、Boolean(布尔类型)、Null(空类型)、Undefined(未赋值)、Object(对象)*/
10 //数字类型
11 var num;
12 num = 0; //可以先声明一个变量，后赋值
13 var num1,num2,num3;
14 num1=100,num2=200,num3=300; //也可以一次性声明多个变量，然后赋值
15 var num4=400,num5=400,num6=400; //还可以一次性声明多个变量，并同时赋值
16 alert(num); /*alert：弹框*/
17 console.log(num3.toString()); //转换为字符串类型，如果被转换的对象是null，就不能用toString()，得用String()
18 console.log(Boolean(num)); //输出false（因为num=0），将数字转换为Boolean类型
19 console.log(Boolean(num1)); //输出true（因为num1>0），将数字转换为Boolean类型
20
21 //字符串类型
22 var str="我是字符串类型，";
23 var str1="你是谁？ "
24 var str2="100";
25 var str3="100.99";
26 var str5="Hello World";
27 var str6="语文-数学-英语-物理-化学";
28 for(var i=0;i<str5.length;i++){ //遍历字符串
29 console.log(str5[i]);
30 }
31 console.log(str);
32 console.log(str+str1); //字符串拼接
33 console.log(str.length); //获取字符串的长度
34 console.log(str1.trim()); //去除字符串两端的空格
35 console.log(str5.toLocaleLowerCase()); //将字符串转换为小写
36 console.log(str5.toLocaleUpperCase()); //将字符串转换为大写
37 console.log(str6.split("-")); //根据“-”，分割字符串，转成数组（可遍历取出每个元素）
38 console.log(str5.slice(2,5)); //输出llo，从字符串索引2的位置，截取到索引5的前一位（不包括索引5所在的字符）
39 console.log(str5.indexOf("l")); //从左往右找字符，输出字符串str5中，l字符所在的索引
40 console.log(str5.indexOf("l",2)); //从左边第二个字符开始往右找，输出字符串str5中，l字符所在的索引。不存在则输出-1
41 console.log(str5.lastIndexOf("l")); //从右往左找字符，输出字符串str5中，l字符所在的索引
42 console.log(Number(str2)); //输出100，将str2转换为数字类型，如果str2不能转为数字，则返回NaN
43 console.log(parseInt(str3)); //输出100，将str3转换为数字类型，并同时取整（不四舍五入）
44 console.log(parseFloat(str3)); //输出100.99，将str3转换为浮点数
45
46 //布尔类型
47 var bool=true;
48 console.log(bool);
49
50 //Undefined类型
51 var und; //只声明不赋值，该对象就是Undefined类型
52 console.log(und); //输出undefined
53 console.log(und+10); //这个会输出NaN，因为und没有赋值，所以是Undefined类型，Undefined加上任何类型都会输出NaN
54
55 //空类型
56 var nul=document.getElementById("abcd"); //因为body里没有值为abcd的id，所以这里就会返回空类型
57 console.log(nul);
58 console.log(String(nul)); //将空类型转为字符串，必须用String()，不能用toString()
59
60 //获取数据类型
61 console.log(typeof(str));
62 console.log(typeof(nul)); //空类型获取数据类型是，返回的是Object类型
63
64 //变量的预解析
65 console.log(pre); //将变量使用，放在变量声明前面，仍能执行，就叫变量的预解析。但输出的却是undefined，不是下面的变量内容。可如果下面没有声明变量，就会报错了。
66 var preVar="我是预解析变量！"
67
68
69
70 /*js中的操作符：算术运算符、复合运算符、关系运算符、逻辑运算符、一元运算符*/
71 //算数运算符：+ - * / %
72 var num=100;
73 var sum=num+100;
74 console.log(sum);
75
76 //复合运算符：+= -= *= /= %=
77 var num1=100;
78 num1+=200;
79 console.log(num1); //输出300
80
81 //关系运算符：> < >= <= == === != !==
82 var num2="100";
83 var num3=100;
84 console.log(num2==num3); //结果是true，使用2个等于号（等于）的时候，只要数值相等就返回true
85 console.log(num2===num3); //结果是false，使用3个等于号（恒等于）时，会同时比较数值和数据类型，所以返回false
86
87 //逻辑运算符：& || !
88
89 //一元运算符：++ --
90 var num4=100;
91 num4++;
92 console.log(num4); //输出101
93
94
95
96 /*js中的语句*/
97 //if-else
98 var num1=200;
99 var num2=100;
100 if(num1>num2){
101 console.log(num1);
102 }else{
103 console.log(num2);
104 }
105
106 //if-else if-else
107 var money=13000;
108 if(money>=20000){
109 console.log("个人所得税25%");
110 }else if(money>=15000){
111 console.log("个人所得税20%");
112 }else if(money>=10000){
113 console.log("个人所得税15%");
114 }else{
115 console.log("无需缴税");
116 }
117
118 //三元表达式：var var1=expression1?expression2:expression3
119 var num1=100;
120 var result=(num1%7)==0?"可以被7整除":"不能被7整除";
121 console.log(result);
122
123 //switch
124 var level="A";
125 switch(level){
126 case "A":console.log("90~100");break;
127 case "B":console.log("80~90");break;
128 case "C":console.log("70~80");break;
129 default:console.log("不及格");
130 }
131
132 //while循环语句
133 var i=1;
134 while(i<=10){
135 console.log(i);
136 i++;
137 }
138
139 //do while循环语句
140 var i=1;
141 do{
142 console.log(i);
143 i++;
144 }while(i<=10);
145
146 //for循环语句
147 for(var i=1;i<=10;i++){
148 console.log(i);
149 }
150
151 //循环中的continue和break
152 //continue; //跳过此次循环，继续下一次循环
153 //break; //结束循环
154
155
156
157 /*js中的数组*/
158 //通过构造函数创建
159 var arr=new Array(); //创建一个空数组
160 var arr1=new Array(5); //创建一个长度为5的数组
161 var arr2=new Array(10,20,30,40,50); //创建一个长度为5的数组，并同时赋值
162 arr2[2]=300; //通过索引给数组赋值
163 console.log(arr);
164 console.log(arr1);
165 console.log(arr2);
166 console.log(arr2[1]); //输出数组arr2里的第2个元素
167
168 //基本类型创建数组
169 var arr3=[10,20,30,40]; //创建一个长度为4的数组，并同时赋值
170 var arr4=["h","e","l","l","o"]; //创建一个长度为5的数组，并同时赋值
171 console.log(arr3);
172
173 //遍历数组，并输出元素
174 for(var i=0;i<arr3.length;i++){
175 console.log(arr3[i]);
176 }
177
178 //遍历数组，并拼接字符串
179 var str4=""; //这里必须有=""，否则str4就是Undefined类型
180 for(var i=0;i<arr4.length;i++){
181 var str4=str4+"-"+arr4[i];
182 }
183 console.log(str4);
184
185 //将数组前后对应的元素交换
186 var temp="";
187 for(var i=0;i<arr4.length/2;i++){ //获取交换次数
188 temp=arr4[i];
189 arr4[i]=arr4[arr4.length-1-i];
190 arr4[arr4.length-1-i]=temp;
191 }
192 console.log(arr4);
193
194 //求数组中最大值
195 var max=arr3[0];
196 for(var i=1;i<arr3.length;i++){
197 if(max<arr3[i]){
198 max=arr3[i];
199 }
200 }
201 console.log(max);
202
203 //数组的冒泡排序
204 var arr5=[20,10,40,50,30];
205 for(var i=0;i<arr5.length-1;i++){ //获取总共比较几轮（5个元素就比较4轮）
206 for(var k=0;k<arr5.length-1-i;k++){ //获取每轮比较几次（第一轮比较4次：5-1-0）
207 if(arr5[k]<arr5[k+1]){ //前面的元素比后面小，则交换
208 var temp="";
209 temp=arr5[k];
210 arr5[k]=arr5[k+1];
211 arr5[k+1]=temp;
212 }
213 }
214 }
215 console.log(arr5);
216
217 //数组的方法
218 console.log(arr3.length); //获取数组的长度
219
220
221
222 /*js中的函数*/
223 //静态函数
224 //声明
225 function getSum1(){
226 var num1=10;
227 var num2=20;
228 var sum=num1+num2;
229 console.log(sum);
230 }
231 //调用
232 getSum1();
233
234 //有参数的函数
235 function getSum2(num1,num2){
236 var sum=num1+num2;
237 console.log(sum);
238 }
239 getSum2(40,50);
240
241 //有返回值的函数
242 function getSum3(num1,num2){
243 var sum=num1+num2;
244 return sum;
245 }
246 var result=getSum3(50,50);
247 console.log(result);
248
249 //匿名函数
250 var sayHi=function(){ //因为是匿名函数，所以需要定义一个变量来接收函数值
251 console.log("hello world!");
252 }
253 sayHi(); //调用匿名函数
254
255 //有隐式全局变量的函数
256 function variable(){
257 dog="小狗"; //变量前面没有var，就是隐式全局变量
258 console.log(dog);
259 }
260 variable();
261
262 //函数的预解析
263 pre(); //将函数调用，放在函数声明前面，仍能正常执行，这就叫函数的预解析
264 function pre(){
265 console.log("我是预解析函数！");
266 }
267
268 //函数的方法
269 function nums(){
270 console.log(arguments[0]); //输出第一个参数
271 console.log(arguments.length); //arguments.length，获取函数一共传入了几个参数
272 }
273 nums(10,20,30,40,50,60); //输出6
274
275
276
277 /*js中的对象*/
278 //用构造函数创建对象
279 var person=new Object();
280 person.name="小明"; //这是对象的属性
281 person.sex="男";
282 person.height="170";
283 person.sayHi=function(){ //这是对象的方法
284 console.log("hello");
285 }
286 console.log(person.name); //输出对象的某个属性
287 person.sayHi(); //调用对象的方法
288
289 //用函数的方式创建对象，并给对象的属性赋值
290 function persons(name,height){
291 var pers=new Object();
292 pers.name=name;
293 pers.height=height;
294
295 pers.sayHello=function(){
296 console.log("大家好，我是"+pers.name+"，我的身高是"+this.height); //这里用对象名或者this都可以
297 }
298 return pers;
299 }
300 var per1=persons("张三",180); //创建一个persons对象
301 per1.sayHello();
302
303 //自定义构造函数创建对象
304 function human(name,height){
305 this.name=name;
306 this.height=height
307 this.sayHello1=function(){
308 console.log("大家好，我是"+this.name+"，我的身高是"+this.height);
309 }
310 }
311 var per2=new human("李四",170); //注意这里new的不是Object，而是human
312 per2.sayHello1();
313
314 //字面量形式创建对象
315 var obj={
316 name:"小明", //这里使用逗号，不是分号
317 age:18,
318 height:170,
319 sayHello2:function(){
320 console.log("我是"+this.name+"，我的年龄是"+this.age+"，我的身高是"+this.height);
321 }
322 }
323 console.log(obj.name); //输出name属性值（方法一）
324 console.log(obj["name"]); //输出name属性值（方法二）
325 obj.sayHello2(); //调用sayHello2方法（方法一）
326 obj["sayHello2"](); //调用sayHello2方法（方法二）
327
328 //声明json对象
329 var jason={
330 "name":"王五",
331 "age":"18",
332 "height":"183"
333 }
334 console.log(jason.name); //第1种输出方法
335 console.log(jason["age"]); //第2种输出方法
336 var key="height";
337 console.log(jason[key]); //第3种输出方法
338
339 //遍历json对象
340 for(var key in jason){ //因为json是无序的，所以不能用for(int i=0;i<...)这种方式遍历
341 console.log(key);
342 console.log(jason[key]);
343 }
344
345 //对象的方法
346 console.log(per2 instanceof(human)); //instanceof：per2是否属于human类，返回值是true/false
347
348 //Math对象：静态对象，无需创建
349 Math.PI; //获取PI值
350 Math.abs(-11); //11，获取绝对值
351 Math.max(10,20,50,70); //70，获取一组数据的最大值
352 Math.min(10,20,50,70); //10，获取一组数据的最小值
353 Math.random(); //获取随机数
354 Math.sqrt(); //获取平方根
355
356 //Date对象
357 var dt=new Date();
358 console.log(dt); //输出当前时间
359 console.log(dt.getFullYear()); //获取年
360 console.log(dt.getMonth()+1); //获取月：因为国外是从0开始，所以我们要+1
361 console.log(dt.getDate()); //获取日
362 console.log(dt.getHours()); //获取小时
363 console.log(dt.getMinutes()); //获取分钟
364 console.log(dt.getSeconds()); //获取秒
365 console.log(dt.getDay()); //获取星期几，0代表周日
366 console.log(dt.toLocaleDateString()); //获取年月日
367 console.log(dt.toLocaleTimeString()); //获取时分秒
368 </script>
369 </head>
370
371 <body>
372 <div id="abc"></div>
373 <input type="button" value="点击" onclick="alert('hello world!')"></input> <!--按钮，值显示“点击”，点击事件：出现hello world弹出框-->
374
375 <!--引入外部JavaScript-->
376 <!--js的引用一般放在body的最后，因为js引入时，页面会停止加载。如果放在head里面，就会出现js引入完了，页面还没加载完成，导致报错-->
377 <script type="text/javascript" src="javascript.js"></script>
378 </body>
379 </html>
。