js-引用類型-Array
1.數組的操做方法
1 <html> 2 <meta http-equiv="content-type" charset="utf-8" /> 3 <title>操做數組的方法，記得跟python類比</title> 4 5 <script type="text/javascript"> 6 var shuzu=new Array("eric","alis","django","tornado"); 7 //數組的合併方法，concat() 8 console.log("數組的合併方法"); 9 //三種不一樣的數組轉換成字符串的方式 10 console.log(shuzu.concat("liuhuan",[2,3,"jim"]).toString()); 11 console.log(shuzu.concat("liuhuan",[2,3,"jim"]).toLocaleString()); 12 console.log(shuzu.concat("liuhuan",[2,3,"jim"].valueOf())); 13 //數組的切片方法,跟python同樣顧前不顧後 14 console.log("======================="); 15 console.log(shuzu.slice(2,3)); 16 //數組的最強大的方法splice方法，主要用途是向數組的中部插入項；有返回值，是一個數組（刪除的項組成）***** 17 //1.刪除 18 console.log("splice,js數組中的超級方法，基友刪除和添加，替換的功能"); 19 var spliceDemo=["eric","宋佳",2,3,3,4]; 20 var delArray=spliceDemo.splice(0,2); 21 console.log(delArray.toString()); 22 console.log(spliceDemo); 23 console.log("替換"); 24 var delArray2=spliceDemo.splice(0,0,"lizbeo","liuhuan"); 25 console.log(delArray2); 26 console.log(spliceDemo); 27 console.log("插入,並刪除"); 28 var delArray3=spliceDemo.splice(0,2,"lizbeo222",2222); 29 console.log(delArray3); 30 console.log(spliceDemo); 31 </script> 32 <body> 33 <h1>操做數組的方法</h1> 34 </body> 35 </html>
2.迭代方法
1 <html> 2 <head> 3 <meta http-equiv="content-type" charset="utf-8"> 4 <title>迭代方法</title> 5 <script type="text/javascript"> 6 //ECMAScript爲數組定義了5個迭代方法。每一個方法都接收2個參數：要在每一項運行的函數（可選）和運行該函數的做用域對象 7 //影響this的值。傳入這些方法中的函數會接收三個參數：數組項的值，該項在數組中的位置和數組對象自己。根據使用方法的不一樣，這個函數 8 //執行後的返回值可能會也可能不會影響方法的返回值。 9 /*evary()*/ 10 var shuzu=[1,2,3,4,5,4,3,2,1]; 11 12 var evaryResult=shuzu.every(function(item,index,array){ 13 return item>2; 14 });//結果是flase,由於every顧名思義就是數組中的每一個值都要大於2才能獲得true結果。 15 console.log(evaryResult); 16 /*some()*/ 17 var someResult=shuzu.some(function(sb,index,array){ 18 return sb>2; 19 }); 20 console.log(someResult); 21 /*filter()監聽，監聽符合條件的數組並返回數組*/ 22 var filterResult=shuzu.filter(function(item,sf,jfsklfs){ 23 return item>2; 24 }); 25 console.log(filterResult); 26 /*map();對每一項進行操做，返回每一項操做後的數組*/ 27 var mapResult=shuzu.map(function(mapDemo,sb,sjflasjfaslkjflas){ 28 return mapDemo**2; 29 }); 30 console.log(mapResult); 31 //forEach();方法，至關於for迭代遍歷數組 32 console.log("====================="); 33 for(var i;i<=shuzu.length;i++){ 34 window.alert(shuzu[i]); 35 }; 36 37 38 39 40 </script> 41 </head> 42 <body> 43 <h1>迭代方法</h1> 44 <h2>其中map是真的有用這種方法，js數組的map方法能夠對每一項進行相同的操做，這是多麼叼，最關鍵的是代碼不多。</h2> 45 </body> 46 </html>
3.歸併方法(從前日後迭代和從後往前迭代)
1 <!DOCTYPE> 2 <html> 3 <head> 4 <meta http-equiv="content-type" charset="utf-8"> 5 <title>歸併方法</title> 6 <script type="text/javascript"> 7 var shuzu=new Array(); 8 shuzu=[1,2,3,4,5,6]; 9 //求數組中的每一項的和使用reduce(); 10 var sum=shuzu.reduce(function(pre,cur,index,arry3){ 11 return pre+cur; 12 }); 13 console.log(sum); 14 //使用reduceRight()求數組中的全部項的積; 15 var su1=shuzu.reduceRight(function(pre,cur,index,arry33){ 16 return pre*cur; 17 }); 18 console.log(su1); 19 20 var su3=shuzu.reduce(function(pre,cur,index,sjfsl){ 21 return pre*cur; 22 }); 23 console.log(su3); 24 </script> 25 </head> 26 <body> 27 <h1>歸併方法</h1> 28 <h2>這兩個方法都接收兩個參數：一個在每一項上調用的函數和（可選的）做爲歸併基礎的初始值。傳給reduce()和reduceRight()的函數接收4個參數</h2> 29 <h2>前一個值，當前值，項的索引和數組對象。這個函數返回的任何值都會做爲第一個參數傳給下一項。第一次迭代發生在數組的第二項 30 ，所以第一個參數是數組的第一項，第二個參數是數組的第二項。</h2> 31 32 </body> 33 </html>
4.檢測數組
1 <!DOCTYPE> 2 <html> 3 <head> 4 <meta http-equiv="content-type" charset="utf-8" /> 5 <script type="text/javascript"> 6 /*Javascript中的數組是1.能夠存儲任意類型 2.動態調整。*/ 7 //建立方式一：使用array的構造函數： 8 var arrryDemo1=new Array(); 9 var arrayDemo2=new Array(3);//建立一個包含3項的數組 10 var arrayDemo3=new Array("alex");//建立一個包含一項的數組 11 console.log(arrayDemo2.length); 12 console.log(arrayDemo3[0]); 13 //建立方式二：使用字面量進行創造 14 var color=["red","blue",234,2.34]; 15 console.log(color.length); 16 console.log(color[3]); 17 console.log("length屬性不僅是可讀，還能夠進行賦值"); 18 color.length=5; 19 console.log(color[4]);//undefinend 20 console.log("移除最後一項"); 21 color.length=3; 22 console.log(color[3]);//undefinend 23 24 //檢測數組 25 var checkArray=new Array("李澤博","liuhuan",23424); 26 if(checkArray instanceof Array){ 27 console.log("這是數組類型，數組類型是一個內置引用對象，因此咱們使用檢測方式的時候，使用的是instanceof"); 28 } 29 30 </script> 31 <style type="text/css"> 32 33 </style> 34 </head> 35 <body> 36 <h1>你好，Javascript</h1> 37 </body> 38 </html>
5.位置方法
1 <html> 2 <head> 3 <meta http-equiv="content-type" charset="utf-8" > 4 <title>位置方法</title> 5 6 <script type="text/javascript"> 7 console.log("位置方法"); 8 var indexDemo=new Array(); 9 indexDemo.push("eric","宋佳","李逵"); 10 console.log(indexDemo.indexOf("eric")); 11 //要查找的項是「李逵」，查找的位置索引是1. 12 console.log(indexDemo.lastIndexOf("李逵",2)); 13 </script> 14 </head> 15 <body> 16 <h1>位置方法</h1> 17 <h3>這2個方法都接收2個參數，一個是要查找的項和（可選的）表示查找起點位置的索引。其中 18 indexOf()方法從數組的開始進行查找，而lastIndexOf()是從結尾開始查找。若是沒有，返回-1 19 </h3> 20 </body> 21 </html>
6.重排序
1 <html> 2 <head> 3 <meta http-equiv="content-type" charset="utf-8" /> 4 <title>從新排序</title> 5 6 <script type="text/javascript"> 7 var arrayDemo=[1,2,3,4,5]; 8 //reverse() 9 console.log(arrayDemo.reverse()); 10 //sort(); 11 console.log(arrayDemo.sort());//可是sort是以第一個字母進行的排序 12 </script> 13 </head> 14 <body> 15 <h1>reverse，sort</h1> 16 </body> 17 </html>
7.轉換方法
1 <!DOCTYPE> 2 <html> 3 <head> 4 <title>轉換方法，也就是數組轉換成，字符串，由於alert，console能夠自動轉換成字符串</title> 5 <meta http-equiv="content-type" charset="utf-8"> 6 <script type="text/javascript"> 7 /*轉換方法：*/ 8 var shuzu=["eric","hahah ","劉歡"]; 9 console.log(shuzu.toString()); 10 console.log(shuzu.toLocaleString()); 11 console.log(shuzu.valueOf());//返回的是對象 12 alert(shuzu.valueOf());//返回字符串 13 14 //join方法 15 shuzu.join("||"); 16 console.log(shuzu); 17 alert(shuzu); 18 </script> 19 </head> 20 <body> 21 </body> 22 </html
8.FIFO
1 <html> 2 <head> 3 <title>先進先出</title> 4 <meta http-equiv="content-type" charset="utf-8" / > 5 6 <script type="text/javascript"> 7 console.log("先進先出"); 8 var color=new Array(); 9 var count=color.push("eric","bob","劉歡"); 10 console.log("pushi以後數組的長度是:"); 11 console.log(count); 12 console.log("取出來第一個值"); 13 console.log(color.shift()); 14 var count1=color.unshift("pop","shift","unshift"); 15 console.log("使用unshift進行隊列壓值"); 16 console.log(color.shift());//pop 17 console.log(color.pop());//劉歡 18 19 20 </script> 21 </head> 22 <body> 23 <h1>先進先出</h1> 24 <h2>後壓前取，前壓後取</h2> 25 </body> 26 <script type="text/javascript"> 27 /*後壓前取*/ 28 var shuzu=new Array(); 29 var count=shuzu.push("劉備","張飛","關羽"); 30 console.log("==============="); 31 console.log(shuzu.shift()); 32 console.log(shuzu.pop()); 33 /*前壓後取*/ 34 var shuzu2=new Array(); 35 var count2=shuzu2.unshift("諸葛亮","宋江","魯智深"); 36 console.log("===================="); 37 console.log(count2); 38 console.log(shuzu2.pop()); 39 </script> 40 </html>
9.LIFO
1 <html> 2 <head> 3 <title>後進先出</title> 4 <meta http-equiv="content-type" charset="utf-8" /> 5 <script type="text/javascript"> 6 var color=new Array(); 7 //壓進入，後進先出。注意這個函數是有返回值的，返回的是新數組的長度。 8 var count=color.push("red","yellow","black"); 9 console.log("函數的返回值是:"); 10 console.log(count); 11 alert(color.length); 12 alert(color.pop()); 13 </script> 14 </head> 15 <body> 16 <h1>後進先出</h1> 17 </body> 18 </html>
相關文章
- 1. JS引用類型之Array
- 2. 淺談JS引用類型之Array類型
- 3. JavaScript引用類型---Array
- 4. 引用類型之Array
- 5. JavaScript引用類型——Array類型（二）
- 6. JavaScript引用類型——Array類型（一）
- 7. 引用類型之Array類型
- 8. javascript引用類型之Array類型
- 9. JavaScript引用類型——Array類型（三）
- 10. javascript引用類型之Array 類型
- 更多相關文章...
- • C# Array 類 - C#教程
- • SQL 通用數據類型 - SQL 教程
- • Kotlin學習（二）基本類型
- • Composer 安裝與使用
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
