摘要:引用類型類型引用類型是一種數據結構,用于將數據和功能聯系起來。
引用類型-Array類型
引用類型是一種數據結構,用于將數據和功能聯系起來。
創建對象的方式:
1.new操作符
var array=new Array();
2.字面量表示法創建
var array=[];Array
檢測數組:檢測數組是基本類型還是引用類型
轉換方法:將數組轉換成字符串或數組對象
棧方法:后進先出的操作數組的方法
隊列方法:先進先出的操作數組的方法
操作方法:數組的拼接、截取、插入、刪除、替換
位置方法:查找數組項、返回索引值
迭代方法:對每個數組項進行操作的方法
縮小方法:操作數組的每一項,構建最終的返回值
1 檢測數組檢測數組的方法;instanceof操作符的問題是當開發環境引入多個框架存在多個全局環境的時候,會出現不同的Array構造函數,進而出現不同的結果。
Array.isArray()這個方法很好的解決了這個問題。
arrName instanceof Array
`var array=[1,2,3];` `console.log(array instanceof Array) //true`
Array.isArray(arrName)
`console.log(Array.isArray(array)) //true`2 轉換方法
toString():返回以逗號分隔拼接而成的字符串
valueOf():返回對象
toLocaleString():區別很小,如果是數組調用這個方法,那么數組的每一項都會調用這個方法
alert(value)==alert(value.toString())
`var array=[1,2,3];` `var arrayToString=array.toString();` `var arrayValueOf=array.valueOf();` `var arrayToLocalString=array.toLocaleString();` `console.log(arrayToString);// 1,2,3` `console.log(arrayValueOf);//[1, 2, 3]` `console.log(arrayToLocalString);//1,2,3`3 棧方法 (LIFO:last in first out)
ES數組類似于數據結構的方法
棧是一種限制插入和刪除項的數據結構
push():接收任意數量的參數添加至數組尾部,返回數組長度值
pop():從數組末尾移除最后一項,減少數組的length值,返回該數組被刪除的最后一項
4 隊列方法 (FIFO:first in first out)結合push()和shift()方法可以實現像隊列一樣使用數組
使用unshift()和pop()可以從相反的方向模擬隊列
shift()移除并返回該數組的第一項;
unshift()從數組前端添加任意個參數,并返回新數組的長度
5 操作方法
concat()復制原數組連接新數組形成新副本;
`var arr1=["q","w","e"];` `var arr2=["h","u","o"];` `document.write(arr1.concat(arr2)); //q,w,e,h,u,o`
slice() 有一個參數時,復制參數為起始位置到末尾的副本;有兩個參數時,復制兩個數字中間部分的數組項;如果參數是負數,復制用數組的長度加上負數值得到的兩個參數之間的數組項;
`var arr3=["h","e","l","l","o"];` `console.log(arr3.slice(1));//e,l,l,o` `console.log(arr3.slice(-4));//e,l,l,o` `arr3.slice(-4)===arr3.slice(1);//true`
splice() 三個參數:分別對應起始位置,刪除項的個數,替換項;通過對這三個參數的合理運用可以實現刪除、插入、替換等操作。
//從第一項開始刪除兩項 var splice_arr1=["h","e","l","l","o"]; console.log(splice_arr1.splice(1,2))//返回的是被刪除的項組成的數組["e", "l"] //從第二項后插入三項old var splice_arr2=["h","e","l","l","o"]; var removed=splice_arr2.splice(2,0,"K","K"); console.log(splice_arr2);//["h", "e", "K", "K", "l", "l", "o"] console.log(removed)//返回的是一個空數組 //替換 var removed=splice_arr3.splice(2,2,"P","P"); console.log(splice_arr3);//["h", "e", "P", "P", "o"] console.log(removed)//返回的是被替換的值["l", "l"] `6 位置方法
返回索引值
indexOf() 從前往后找
lastIndexOf() 從后往前找
var index_arr=["h","e","l","l","o"]; var indexOf_arr=index_arr.indexOf("l"); console.log("原數組:",index_arr)//原數組不變 console.log("返回值:",indexOf_arr)//返回值是第一個查到位置的索引值2 var index_arr2=["h","e","l","l","o"]; var indexOf_arr2=index_arr2.lastIndexOf("l"); console.log("原數組:",index_arr2)//原數組不變 console.log("返回值:",indexOf_arr2)//返回值是第一個查到位置的索引值37 迭代方法
接收兩個參數,一個是函數,另一個是運行該函數的作用域對象。 第一個參數函數接收三個參數 數組項的值 item,值的位置 idnex ,數組本身 array
every() //都是返回true則返回true
var numbers=[1,2,3,4,5,6,7,8,9,0,9,8,7,65,5,4,33,21,1,1,23,3,4]; var everyArr=numbers.every(function(it, index ,arr){ if(it>9){ return true; } }) console.log(everyArr);///false
some()//有一個返回true,則返回true
var someArr=numbers.some(function(it, index ,arr){ return (it > 9) ; }) console.log(someArr);///true
forEach()//沒有返回值
var numbers=[1,2,3,4,5,6,7,8,9,0,9,8,7,65,5,4,33,21,1,1,23,3,4]; var forEachArr=numbers.forEach(function(it, index ,arr){ var it=it*100; console.log(it) }) //無返回值
filter()//返回該函數會返回true的項組成的數組,用于過濾
var numbers=[1,2,3,4,5,6,7,8,9,0,9,8,7,65,5,4,33,21,1,1,23,3,4]; var filterArr=numbers.filter(function(it, index ,arr){ if(it>10){ return it; }
})
console.log(filterArr);//[65, 33, 21, 23] //返回返回值組成的新數組
map()//返回每個函數的返回值
var numbers=[1,2,3,4,5,6,7,8,9,0,9,8,7,65,5,4,33,21,1,1,23,3,4];
var mapArray=numbers.map(function(it, index ,arr){ var it=it*100; return it; }) console.log(mapArray) //[100, 200, 300, 400, 500, 600, 700, 800, 900, 0, 900, 800, 700, 6500, 500, 400, 3300, 2100, 100, 100, 2300, 300, 400] //返回返回值組成的新數組8 縮小方法
reduce()
var numbers=[1,2,3,4,5,6,7,8,9,0,9,8,7,65,5,4,33,21,1,1,23,3,4]; var allArray=numbers.reduce(function(prev,cur,index,arr){ return (prev+cur); }) console.log(allArray);//229
reduceRight()
var numbers=[1,2,3,4,5,6,7,8,9,0,9,8,7,65,5,4,33,21,1,1,23,3,4];
var allArrayRight=numbers.reduceRight(function(prev,cur,index,arr){ return (prev+cur); }) console.log(allArrayRight);//229
總結:經過這次總結和練習,覺得自己在以后再次遇到操作數組應該不會再感到害怕了;
自己的工作中用的最多的是split()這個字符串截取的操作方法,這個方法雖然是字符串的方法但是很好用。
這種總結方式,效果挺好,就是效率稍微低一點,這點咋解決啊,是個問題。。。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/80379.html
摘要:理解的函數基礎要搞好深入淺出原型使用原型模型,雖然這經常被當作缺點提及,但是只要善于運用,其實基于原型的繼承模型比傳統的類繼承還要強大。中文指南基本操作指南二繼續熟悉的幾對方法,包括,,。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。 怎樣使用 this 因為本人屬于偽前端,因此文中只看懂了 8 成左右,希望能夠給大家帶來幫助....(據說是阿里的前端妹子寫的) this 的值到底...
摘要:解耦優勢代碼復用,單元測試。常用比較誤區可同時判斷,可用來判斷對象屬性是否存在。使用作判斷無法進行充分的類型檢查。文件中應用常量參考文檔高級程序設計作者以樂之名本文原創,有不當的地方歡迎指出。 showImg(https://segmentfault.com/img/bVburXw?w=500&h=400); 編寫可維護性代碼 可維護的代碼遵循原則: 可理解性 (方便他人理解) 直觀...
摘要:但是確是一個特例它的指向的是至于為什么簡單解釋下所有的構造器都來自于,甚至包括根構造器及自身。所有構造器都繼承了的屬性及方法。如知道了所有構造器含內置及自定義的都是,的是誰呢這說明所有的構造器也都是一個普通對象,可以給構造器添加刪除屬性等。 showImg(https://segmentfault.com/img/remote/1460000009446154); 前言 此文章為加深對...
摘要:與純占位符相對應,非純占位符的切片是非空列表,對它進行操作賦值與刪除,將會影響原始列表。不同位置的替換非等長替換刪除元素切片占位符可以帶步長,從而實現連續跨越性的替換或刪除效果。 2018-12-31 更新聲明:切片系列文章本是分三篇寫成,現已合并成一篇。合并后,修正了一些嚴重的錯誤(如自定義序列切片的部分),還對行文結構與章節銜接做了大量改動。原系列的單篇就不刪除了,畢竟也是有單獨成...
閱讀 853·2021-11-24 09:38
閱讀 1085·2021-10-08 10:05
閱讀 2577·2021-09-10 11:21
閱讀 2800·2019-08-30 15:53
閱讀 1827·2019-08-30 15:52
閱讀 1964·2019-08-29 12:17
閱讀 3418·2019-08-29 11:21
閱讀 1609·2019-08-26 12:17