day46homework常量字符串拼接結構賦值擴展運算符for-of循環map函數默認值
阿新 • • 發佈:2017-08-31
html javascript css
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>01定義常量.html</title> <!--常量--> <script> //常量:1.一旦定義 不能更改 const PI = 3.14; // console.log(PI); // PI = 3.1415; error // error: 2.必須賦初始值 // const PI1; // PI1 = 3.1415926; // console.log(PI1); </script> <!--字符串拼接--> <script> // 用 + 拼接 var name = "zhang"; var msg = "hello " + name; console.log(msg); var name1 = "zhang"; var msg1 = `hello ${name1}`; //${name} console.log(msg1); </script> <!--結構賦值--> <script> /* var a = 1; var b = 2; var c = 3; console.log(a,b,c); */ //數組賦值 var [a,b,c] = [11,22,33]; console.log(a,b,c); var [a,[b,c],d] = [1,[2,3],4]; console.log(a,b,c,d); //json 賦值 var {a,b,c} = {a:1,c:2,b:3}; console.log(a,b,c); //結構賦值 等號兩邊的結構要相同 var [a,{b,c},d] = [1,{c:3,b:2},4]; console.log(a,b,c,d); /* var {a = 10, b = 20}; console.log(a,b); //error */ var {a = 100,b = 200} = {}; console.log(a,b); // 輸出結果 100 200 var {a = 100,b = 200} = {a:111,b:222}; console.log(a,b); // 輸出結果 111 222 </script> <!--擴展運算符--> <script> var arr1 = [1,2,3,4,5]; 1 數組賦值(error) var arr2 = arr1; //將arr1的地址賦給了arr2 操作arr2影響arr1 arr2.pop(); 1 var arr2 = []; for(var i = 0; i < arr1.length; i++){ arr2.push(arr1[i]); } // 2. var arr2 = [...arr1]; arr2.pop(); console.log(arr1); console.log(arr2); function show(x,y){ console.log(arguments); //arguments不是數組 不能用數組的方法 // arguments.pop(); } // show(1,2); //2. 函數定義時使用擴展運算符,把參數保存在一個數組裏面 function show1(...mgs){ // console.log(mgs); mgs.push(33); //mgs是數組 console.log(mgs); console.log(mgs[0],mgs[1],mgs[2]); } // show1(11,22); //3. 調用時,通過擴展運算符將數組裏的值變成參數列表 var argu = [11,22]; show(...argu); </script> <!--for of 循環--> <script> var arr1 = [11,22,33,44,55]; for(i in arr1){ // console.log(i); // 0 1 2 3 4 i是數組的下標 // console.log(arr1[i]); // 11 22 33 44 55 數組的值 } for(i of arr1){ // console.log(i); //i是數組的值 } for(i of arr1.keys()){ // console.log(i) //i是數組的下標 } var json = {a:44,b:55,c:66}; for(i in json){ // console.log(i); //a b c // console.log(json[i]); //輸出json的值 } //for of 不能遍歷json的值 for(i of json){ // console.log(i); error } </script> <!--map--> <script> //map 是一種數據集合,以key/value的形式存儲和訪問 var map = new Map(); //添加 map.set(‘a‘,11); map.set(‘b‘,22); map.set(‘c‘,"33"); map.set(‘d‘,"dddd"); map.set(‘e‘,‘\\‘); console.log(map); // 查看 // console.log(map.get(‘a‘)); // console.log(map.get(‘b‘)); // console.log(map.get(‘c‘)); //刪除 // map.delete(‘b‘); // console.log(map); for(i of map){ //默認 map實體 // console.log(i); } for(i of map.entries()){ // console.log(i); //map 實體 } for(i of map.values()){ // console.log(i); //map 的值 } for(i of map.keys()){ // console.log(i); //map 的鍵 a b c d e } for([a,b] of map){ //第一個參數是鍵 第二個參數是值 console.log(a+":"+b); } for([key,value] of map){ //獲取map的鍵和值 console.log(key + ":" + value); } </script> <!--函數默認值--> <script> function show(x,y){ if(!x){ x = "hello"; } if(!y){ y = "world"; } console.log(x,y); } // show(); //1.在定義函數時,將默認參數寫在參數列表中 function show1(x,y="bbb"){ console.log(x,y); } // show1(‘a‘); //把參數賦給x // show1(‘a‘,‘c‘); // 把a賦給x 把c賦給y //2.如果默認參數的賦值有變量的話,值是可以動態改變的 var z = 100; function show2(a = z + 1){ console.log(a); } // show2(); //101 //3.結構賦值 function show3({a = 1,b = 2}={}){ console.log(a,b); } // show3(); // show3({a:11,b:22}); function show4({a,b} = {}){ console.log(a,b); } // show4({a:111,b:222}); 111 222 // show4({a:111,b:222}); function show5({a,b}){ console.log(a,b); } // show5({a:100,b:100}); function show6(url,{body = "",method = "get"}){ console.log(method); } // show6("http://www.liyuit.com"); //error // show6("http://www.liyuit.com",{}); //get function show7(url,{body = "",method = "get"}={}){ console.log(method); } show7("http://www.liyuit.com"); </script> <!--函數-rest參數--> <script> //用擴展運算符後的參數來接受多余的參數 function show(x,...args){ console.log(x,args); } show(1,2,3,4,5,6); //把1給了參數 x 把 2,3,4,5,6給了args數組 </script> </head> <body> </body> </html> <!--封閉空間--> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>09封閉空間.html</title> <script> //封閉空間,就是把匿名函數用括號擴氣來,形成自己的作用域 /* (function(){ console.log("aaa"); })(); //相當於自己調用自己 //匿名函數立即執行並傳參 (function(msg){ console.log(msg); }("bbbb")); */ window.onload = function(){ var aBtn = document.getElementsByTagName(‘input‘); console.log(aBtn); /* 點擊按鈕是 輸出當前元素的下標 第一種 用this for(var i = 0; i < aBtn.length; i++){ aBtn[i].index = i; aBtn[i].onclick = function(){ console.log(this.index); } } */ /* 第二種 for(let i = 0; i < aBtn.length; i++){ aBtn[i].onclick = function(){ console.log(i); } } */ //第三種 for(var i = 0; i < aBtn.length; i++){ (function(index){ aBtn[index].onclick = function(){ console.log(index); } }(i)) } } </script> </head> <body> <input type="button" value="按鈕1"> <input type="button" value="按鈕2"> <input type="button" value="按鈕3"> </body> </html>
本文出自 “11183863” 博客,請務必保留此出處http://11193863.blog.51cto.com/11183863/1961508
day46homework常量字符串拼接結構賦值擴展運算符for-of循環map函數默認值