1.函数
1)函数定义的方式
方式1：function count(a){ return x }
方式2：var count = function(){}
案例：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <script type="text/javascript"> 9 //1...+100 ==> 10 //1...+1000 ==> 11 //1...+n ===> 结果 12 //第一种方式 13 /*function count(n){ 14 var result = 0 15 for(var i=1;i<=n;i++){ 16 result += i; 17 } 18 19 return result; 20 }*/ 21 22 //第二种：变量声明的方式声明函数 23 var count = function(n){ 24 var result = 0 25 for(var i=1;i<=n;i++){ 26 result += i; 27 } 28 29 return result; 30 } 31 32 33 console.log(count(200)) 34 </script> 35 </body> 36 </html>
2）两种函数声明方式的区别
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <script type="text/javascript"> 9 console.log(abc) 10 //==>undefined 11 //==>直接输出函数对象 12 13 //函数整体提升到最前面 14 /*function abc(){ 15 console.log("我是abc函数") 16 }*/ 17 18 //变量提升到最前面 19 var abc = function(){ 20 console.log("我是abc函数") 21 } 22 </script> 23 </body> 24 </html>
3）函数的参数
对函数调用时候，不会对参数做任何的检测。
arguments关键词：获取调用函数时候的所有参数
案例：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <script type="text/javascript"> 9 function abc(){ 10 console.log("这是abc") 11 //获取调用函数时候的所有参数 12 console.log(arguments) 13 } 14 15 abc(1,2,3,3,0,4,5) 16 17 18 function cba(a,b,c){ 19 console.log("cba") 20 console.log(a) 21 console.log(b) 22 console.log(c) 23 //console.log(d) 24 } 25 26 cba() 27 28 //动态的将字符串解析成js直接运行 29 var str = "alert('这是用eval运行的代码')" 30 31 eval(str) 32 33 </script> 34 </body> 35 </html>
4）函数的返回值
用return直接返回对象
注意：如果没有写返回值，那么函数默认会返回undefined
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <script type="text/javascript"> 9 function abc(){ 10 return "这是abc" 11 } 12 13 function cba(){ 14 15 } 16 var a = abc() 17 var b = cba() 18 console.log(a) 19 console.log(b) //==》null ==>undefined 20 </script> 21 </body> 22 </html>
2.数组
1）数组
JavaScript的数组是可变长，里面的内容也是可以随意的替换，没有类型的限制
创建数组的方式
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <script type="text/javascript"> 9 //1、字面量的方式创建数组 10 var arr1 = ["蔡徐坤","郭敬明","范冰冰"] 11 //2、new Array()创建数组 12 var arr2 = new Array("苹果",1,"香蕉",function(){console.log(123)}) 13 console.log(arr1) 14 console.log(arr2) 15 16 //数组内容的获取 17 console.log(arr1[0]) 18 console.log(arr1[1]) 19 arr2[3]() 20 21 //数组内容的设置 22 arr2[3] = 3 23 console.log(arr2) 24 25 //一，通过循环输出列表内容 26 for(var i=0;i<arr1.length;i++){ 27 console.log(arr1[i]) 28 } 29 //二，通过forEach输出列表内容 30 duilie.forEach( function(item){ 31 console.log(item) 32 } ) 33 34 </script> 35 </body> 36 </html> 37
2）数组实现队列和栈
数组实现队列的2个方法:（先进先出）
Push：在数组最后添加元素
Shift:在数组的最前面删除元素
数组实现栈的2个方法：（先进后出）
Push:在数组最后添加元素
案例：
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 <script type="text/javascript"> 9 var duilie = ["范冰冰","李晨"] 10 console.log(duilie) 11 duilie.push('蔡徐坤') 12 console.log(duilie) 13 duilie.push("郭敬明") 14 console.log(duilie) 15 //push将内容添加到数组最后 16 17 18 //去掉数组的第一个元素 19 /*duilie.shift() 20 console.log(duilie)*/ 21 22 //去掉数组的最后一个元素 23 /*duilie.pop() 24 console.log(duilie)*/ 25 26 //在数组的第一个元素前面插入数据 27 /*duilie.unshift("雷军") 28 console.log(duilie)*/ 29 30 //在duilie.slice(0,2),在数组从索引0开始切，切到索引2的位置，不包括2； 31 /*console.log(duilie.slice(0,2)) 32 console.log(duilie)*/ 33 34 //splice可以增加或者是删除指定元素，duilie.splice(删除或者增加索引的位置,删除多少个元素,增加的内容（可选）) 35 /*console.log(duilie.splice(0,2,"迪丽热巴","古力娜扎")) 36 console.log(duilie)*/ 37 38 //合并两个数组 39 duilie = duilie.concat(['葡萄','香蕉',"雪梨"]) 40 //相当于for循环 41 duilie.forEach(function(item){ 42 console.log(item) 43 }) 44 45 </script> 46 </body> 47 </html>
3.document.write()
案例：
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title></title> 6 </head> 7 <body> 8 9 <script type="text/javascript"> 10 //document.write("标签") （将script内容写入对应标签内，从而改变标签样式使script内容同样变化） 11 document.write("<caption>九九乘法表</caption>") 12 document.write("<table cellspacing='10px'>") 13 for(var i=1;i<=9;i++){ 14 document.write("<tr>") 15 for(var j=1;j<=i;j++){ 16 document.write("<td>"+j+"x"+i+"="+i*j+"</td>") 17 } 18 document.write("</tr>") 19 } 20 document.write("<table/>") 21 </script> 22 23 </body> 24 </html>