javascript中數(shù)組的常用算法深入分析
前言
Array是Javascript構(gòu)成的一個(gè)重要的部分,它可以用來存儲(chǔ)字符串、對(duì)象、函數(shù)、Number,它是非常強(qiáng)大的。因此深入了解Array是前端必修的功課。本文將給大家詳細(xì)介紹了javascript中數(shù)組的常用算法,下面話不多說了,來一起看看詳細(xì)的介紹吧
一、不改變?cè)瓟?shù)組,返回新數(shù)組(字符串)
1、concat() 連接兩個(gè)或者多個(gè)數(shù)組,兩邊的原始數(shù)組都不會(huì)變化,返回的是被連接數(shù)組的一個(gè)副本。
2、join() 把數(shù)組中所有的元素放入到一個(gè)字符串中,返回字符串
var a = [1,2,3]; a.join([4,5,6]); // "14,5,624,5,63" a.join('sau'); // "1sau2sau3"
3、slice() 從開始到結(jié)束(不包括結(jié)束)選擇數(shù)組的一部分淺拷貝到一個(gè)新數(shù)組
var a = [1,2,3,4,5]; a.slice(0,0); //[] a.slice(0,1); //[1] a.slice(2,4); //[3,4] a.slice(0,5); //[1,2,3,4,5] a.slice(10,1); //[] a.slice(4); //[5]
4、map() 創(chuàng)建一個(gè)新的數(shù)組并返回,其中新數(shù)組的每一個(gè)元素由調(diào)用原始數(shù)組中的每一個(gè)元素執(zhí)行提供的函數(shù)得來,原數(shù)組不變
5、every() 對(duì)數(shù)組中的每一個(gè)元素都執(zhí)行一次指定的回調(diào)函數(shù),直到回調(diào)函數(shù)返回false,此時(shí)every()返回false并不再繼續(xù)執(zhí)行,如果回調(diào)函數(shù)都對(duì)每一個(gè)元素都返回true,那么every()返回true。
6、some() 對(duì)數(shù)組中的每一個(gè)元素都執(zhí)行一次指定的回調(diào)函數(shù),直到回調(diào)函數(shù)返回true,此時(shí)some()返回true并不再執(zhí)行。如果回調(diào)函數(shù)對(duì)每一個(gè)元素都返回false,那么some()將返回false。
7、filter() 創(chuàng)建一個(gè)新數(shù)組,其中包含通過所提供函數(shù)實(shí)現(xiàn)的測(cè)試的所有元素。
二、改變?cè)瓟?shù)組
1、forEach() 針對(duì)每一個(gè)元素執(zhí)行提供的函數(shù)。會(huì)修改原來的數(shù)組,不會(huì)返回執(zhí)行結(jié)果,返回undefined。
2、pop() 刪除數(shù)組最后一個(gè)元素,返回被刪除的元素的值,如果數(shù)組為空,則不改變數(shù)組,返回undefined。
3、push() 向數(shù)組末尾添加一個(gè)或多個(gè)元素,返回改變后數(shù)組的長度。
4、reverse() 顛倒數(shù)組中元素的位置,返回該數(shù)組的引用。
5、shift() 從數(shù)組中刪除第一個(gè)元素,改變?cè)瓟?shù)組,并返回該元素的值。
6、unshift() 將一個(gè)或者多個(gè)元素添加到數(shù)組的開頭,并返回新數(shù)組的長度。
7、sort() 對(duì)數(shù)組的元素進(jìn)行排序,返回?cái)?shù)組。排序不一定是穩(wěn)定的。默認(rèn)排序順序是根據(jù)字符串unicode碼點(diǎn)。
8、splice() 向數(shù)組中添加/刪除元素,然后返回被刪除的新數(shù)組()。
var a = [1,2,3,4,5]; a.splice(0,1); //刪除從0位置開始的1個(gè) 返回[1] a為[2,3,4,5] a.splice(1,0,99) //在1的位置插入99 [2,99,3,4,5] a.splice(1,1,88) //99替換為88 [2,88,3,4,5]
三、遍歷方法
1、獲取屬性名:for...in 和object.key()的區(qū)別
答:1、for in 遍歷對(duì)象可以枚舉的屬性名列表,包括[[prototype]]原型鏈;
2、Object.keys() 只查找屬性名是否在對(duì)象中,返回一個(gè)數(shù)組,包含所有可以枚舉的屬性名;
3、Object.getOwnPropertyNames()只查找屬性名是否在對(duì)象中,返回一個(gè)數(shù)組,包含所有的屬性名,不論是否可枚舉。
2、獲取屬性值: for... of 和object.values()
for of 語句:遍歷可迭代對(duì)象的可枚舉屬性值列表,包括[[propertype]]原型鏈;
object.values() :返回一個(gè)給定對(duì)象自身的所有可枚舉屬性的值,不包括原型鏈。
四、ES6語法Map鍵值對(duì)轉(zhuǎn)化為數(shù)組
new Map創(chuàng)建一個(gè)map
// new Map創(chuàng)建一個(gè)map let map = new Map([[1,"one"], [2,"two"], [3,"three"]]); map.set(4, "four"); // 獲取所有鍵值對(duì) console.log("獲取key") console.log([...map.keys()]) // 輸出[1, 2, 3, 4] console.log("獲取value") console.log([...map.values()]) // 輸出[one, two, three, four] console.log("獲取map數(shù)組") console.log([...map]) // 輸出[[1, "one"], [2, "two"], [3, "three"], [4, "four"]]
五、兩個(gè)升序的數(shù)組合并成一個(gè)升序數(shù)組
1、時(shí)間復(fù)雜度O(M+N),空間復(fù)雜度O(M+N)
function merge(left, right){ let result = [], il = 0, ir = 0; while (il < left.length && ir < right.length) { result.push(left[il] < right[ir] ? left[il++] : right[ir++]); console.log(result); } return result.concat(left.slice(il)).concat(right.slice(ir)); }
2、時(shí)間復(fù)雜度O(M+N),空間復(fù)雜度O(1)
// m, n 是數(shù)組長度 function merge(left, m, right, n) { var i = m - 1, j = n - 1, writeIdx = m + n - 1; while (i >= 0 && j >= 0) left[writeIdx--] = left[i] > right[j]? left[i--] : right[j--]; while (j >= 0) left[writeIdx--] = right[j--]; return left; }
六、數(shù)組重復(fù)問題
(一)數(shù)組去重
1、reduce方法
const distinct = arr => arr.sort().reduce( (init, current) => { if (init.length === 0 || init[init.length - 1] !== current) { init.push( current ); } return init; }, []); let arr = [1,2,1,2,3,5,4,5,3,4,4,4,4]; distinct(arr); // [1, 2, 3, 4, 5]
2、filter方法
const distinct = arr => arr.filter( (element, index, self) => { return self.indexOf( element ) === index; }); let arr = [1,2,1,2,3,5,4,5,3,4,4,4,4]; distinct(arr); // [1, 2, 3, 5, 4]
(二)排序數(shù)組去重
/** * @param {number[]} nums * @return {number} */ var removeDuplicates = function(nums) { if(!nums || nums.length == 0) return 0; let len = 0; for(let i = 1; i < nums.length; i++) { if (nums[len] != nums[i]) { nums[++ len] = nums[i]; } } return len + 1; };
(三)判斷數(shù)組是否存在重復(fù)
/** * @param {number[]} nums * @return {boolean} */ var containsDuplicate = function(nums) { let hashMap = new Map(); for(let i = 0; i < nums.length; i++) { if( hashMap.has(nums[i]) ) { return true; } hashMap.set(nums[i], 1); } return false; };
七、兩個(gè)數(shù)組的交集
給定兩個(gè)數(shù)組,寫一個(gè)方法來計(jì)算它們的交集。
例如:
給定 nums1 = [1, 2, 2, 1], nums2 = [2, 2], 返回 [2, 2].
注意:1、出結(jié)果中每個(gè)元素出現(xiàn)的次數(shù),應(yīng)與元素在兩個(gè)數(shù)組中出現(xiàn)的次數(shù)一致。2、
我們可以不考慮輸出結(jié)果的順序。
跟進(jìn):1、如果給定的數(shù)組已經(jīng)排好序呢?你將如何優(yōu)化你的算法?2、如果 nums1 的大小比 nums2 小很多,哪種方法更優(yōu)?3、如果nums2的元素存儲(chǔ)在磁盤上,內(nèi)存是有限的,你不能一次加載所有的元素到內(nèi)存中,你該怎么辦?
解法:
/** * @param {number[]} nums1 * @param {number[]} nums2 * @return {number[]} */ var intersect = function(nums1, nums2) { var map1 = new Map(); var number = []; for(var i = 0; i < nums1.length; i++) { var map1Value = map1.get(nums1[i]); map1.set( nums1[i], ( map1Value ? map1Value : 0 ) + 1 ); } for(var i = 0; i < nums2.length; i++) { if( map1.has(nums2[i]) && map1.get(nums2[i]) != 0 ) { number.push(nums2[i]); map1.set( nums2[i], map1.get(nums2[i]) - 1 ); } } return number; };
八、找出一個(gè)數(shù)組中只出現(xiàn)一次的數(shù)字
給定一個(gè)非空整數(shù)數(shù)組,除了某個(gè)元素只出現(xiàn)一次以外,其余每個(gè)元素均出現(xiàn)兩次。找出那個(gè)只出現(xiàn)了一次的元素。
/** * @param {number[]} nums * @return {number} */ var singleNumber = function(nums) { let number = 0; for(let i = 0; i < nums.length; i++) { number ^= nums[i]; } return number; };
總結(jié)
以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,謝謝大家對(duì)腳本之家的支持。
- JavaScript碎片—函數(shù)閉包(模擬面向?qū)ο螅?/a>
- 詳解javascript 變量提升(Hoisting)
- JavaScript使用小插件實(shí)現(xiàn)倒計(jì)時(shí)的方法講解
- JavaScript中常用的簡潔高級(jí)技巧總結(jié)
- JavaScript解析機(jī)制與閉包原理實(shí)例詳解
- Javascript之高級(jí)數(shù)組API的使用實(shí)例
- JavaScript實(shí)現(xiàn)預(yù)覽本地上傳圖片功能完整示例
- 詳解JavaScript函數(shù)callee、call、apply的區(qū)別
- JavaScript函數(shù)的4種調(diào)用方法實(shí)例分析
- Javascript讀寫cookie的實(shí)例源碼
相關(guān)文章
js 獲取json數(shù)組里面數(shù)組的長度實(shí)例
下面小編就為大家?guī)硪黄猨s 獲取json數(shù)組里面數(shù)組的長度實(shí)例。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-10-10js實(shí)現(xiàn)iframe框架取值的方法(兼容IE,firefox,chrome等)
這篇文章主要介紹了js實(shí)現(xiàn)iframe框架取值的方法,可兼容IE,firefox,chrome等瀏覽器.涉及JavaScript針對(duì)框架元素取值的相關(guān)技巧,需要的朋友可以參考下2015-11-11javascript自定義in_array()函數(shù)實(shí)現(xiàn)方法
這篇文章主要介紹了javascript自定義in_array()函數(shù)實(shí)現(xiàn)方法,涉及javascript數(shù)組的遍歷與查找相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08three.js 制作動(dòng)態(tài)二維碼的示例代碼
這篇文章主要介紹了three.js 制作動(dòng)態(tài)二維碼的示例代碼,文中講解非常細(xì)致,幫助大家更好的理解和學(xué)習(xí),感興趣的朋友可以了解下2020-07-07基于JavaScript實(shí)現(xiàn)隨機(jī)點(diǎn)名器
這篇文章主要介紹了基于JavaScript實(shí)現(xiàn)隨機(jī)點(diǎn)名器,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-02-02javascript實(shí)現(xiàn)文本域?qū)懭胱址麜r(shí)限定字?jǐn)?shù)
這篇文章主要介紹了javascript實(shí)現(xiàn)文本域的寫入字符個(gè)數(shù)限定字?jǐn)?shù),需要的朋友可以參考下2014-02-02es6中的import導(dǎo)入模塊 和 export導(dǎo)出模塊詳解
require 是 CommonJS 模塊系統(tǒng)中用于導(dǎo)入模塊的關(guān)鍵字,采用同步加載方式;而 import 和 export 是 ES6 模塊系統(tǒng)中用于導(dǎo)入和導(dǎo)出模塊的關(guān)鍵字,采用靜態(tài)加載方式,并且支持異步加載,這篇文章主要介紹了es6中的import導(dǎo)入模塊 和 export導(dǎo)出模塊,需要的朋友可以參考下2023-11-11JS實(shí)現(xiàn)的透明度漸變動(dòng)畫效果示例
這篇文章主要介紹了JS實(shí)現(xiàn)的透明度漸變動(dòng)畫效果,涉及javascript響應(yīng)鼠標(biāo)事件針對(duì)頁面元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2018-04-04