javascript中数组的常用算法深入分析


Posted in Javascript onMarch 12, 2019

前言

Array是Javascript构成的一个重要的部分,它可以用来存储字符串、对象、函数、Number,它是非常强大的。因此深入了解Array是前端必修的功课。本文将给大家详细介绍了javascript中数组的常用算法,下面话不多说了,来一起看看详细的介绍吧

一、不改变原数组,返回新数组(字符串)

1、concat()   连接两个或者多个数组,两边的原始数组都不会变化,返回的是被连接数组的一个副本。

2、join()  把数组中所有的元素放入到一个字符串中,返回字符串

var a = [1,2,3];
a.join([4,5,6]); // "14,5,624,5,63"
a.join('sau');  // "1sau2sau3"

3、slice()    从开始到结束(不包括结束)选择数组的一部分浅拷贝到一个新数组

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()   创建一个新的数组并返回,其中新数组的每一个元素由调用原始数组中的每一个元素执行提供的函数得来,原数组不变

5、every()  对数组中的每一个元素都执行一次指定的回调函数,直到回调函数返回false,此时every()返回false并不再继续执行,如果回调函数都对每一个元素都返回true,那么every()返回true。

6、some()  对数组中的每一个元素都执行一次指定的回调函数,直到回调函数返回true,此时some()返回true并不再执行。如果回调函数对每一个元素都返回false,那么some()将返回false。

7、filter()   创建一个新数组,其中包含通过所提供函数实现的测试的所有元素。

二、改变原数组

1、forEach()   针对每一个元素执行提供的函数。会修改原来的数组,不会返回执行结果,返回undefined。

2、pop()   删除数组最后一个元素,返回被删除的元素的值,如果数组为空,则不改变数组,返回undefined。

3、push()   向数组末尾添加一个或多个元素,返回改变后数组的长度。

4、reverse()   颠倒数组中元素的位置,返回该数组的引用。

5、shift()   从数组中删除第一个元素,改变原数组,并返回该元素的值。

6、unshift()   将一个或者多个元素添加到数组的开头,并返回新数组的长度。

7、sort()   对数组的元素进行排序,返回数组。排序不一定是稳定的。默认排序顺序是根据字符串unicode码点。

8、splice()   向数组中添加/删除元素,然后返回被删除的新数组()。

var a = [1,2,3,4,5];
a.splice(0,1);  //删除从0位置开始的1个 返回[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()的区别

答:1、for in 遍历对象可以枚举的属性名列表,包括[[prototype]]原型链;

2、Object.keys() 只查找属性名是否在对象中,返回一个数组,包含所有可以枚举的属性名;

3、Object.getOwnPropertyNames()只查找属性名是否在对象中,返回一个数组,包含所有的属性名,不论是否可枚举。

2、获取属性值: for... of 和object.values()

for of 语句:遍历可迭代对象的可枚举属性值列表,包括[[propertype]]原型链;

object.values() :返回一个给定对象自身的所有可枚举属性的值,不包括原型链。

四、ES6语法Map键值对转化为数组

new Map创建一个map

// new Map创建一个map
let map = new Map([[1,"one"], [2,"two"], [3,"three"]]);
map.set(4, "four");

// 获取所有键值对
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数组")
console.log([...map]) // 输出[[1, "one"], [2, "two"], [3, "three"], [4, "four"]]

五、两个升序的数组合并成一个升序数组

1、时间复杂度O(M+N),空间复杂度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、时间复杂度O(M+N),空间复杂度O(1)

// m, n 是数组长度
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;
}

六、数组重复问题

(一)数组去重

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]

(二)排序数组去重

/**
 * @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;
};

(三)判断数组是否存在重复

/**
 * @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;
};

七、两个数组的交集

给定两个数组,写一个方法来计算它们的交集。

例如:

给定 nums1 = [1, 2, 2, 1], nums2 = [2, 2], 返回 [2, 2].

注意:1、出结果中每个元素出现的次数,应与元素在两个数组中出现的次数一致。2、

我们可以不考虑输出结果的顺序。

跟进:1、如果给定的数组已经排好序呢?你将如何优化你的算法?2、如果 nums1 的大小比 nums2 小很多,哪种方法更优?3、如果nums2的元素存储在磁盘上,内存是有限的,你不能一次加载所有的元素到内存中,你该怎么办?

解法:

/**
 * @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;
};

八、找出一个数组中只出现一次的数字

给定一个非空整数数组,除了某个元素只出现一次以外,其余每个元素均出现两次。找出那个只出现了一次的元素。

/**
 * @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;
};

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
js获取变量
Aug 24 Javascript
在JavaScript中使用NaN值的方法
Jun 05 Javascript
JavaScript编程学习技巧汇总
Feb 21 Javascript
JavaScript 不支持 indexof 该如何解决
Mar 30 Javascript
Bootstrap每天必学之轮播(Carousel)插件
Apr 25 Javascript
基于CSS3和jQuery实现跟随鼠标方位的Hover特效
Jul 25 Javascript
Bootstrap CDN和本地化环境搭建
Oct 26 Javascript
Bootstrap CSS布局之表单
Dec 17 Javascript
深入理解React中何时使用箭头函数
Aug 23 Javascript
微信小程序云开发之使用云数据库
May 17 Javascript
Vue实现固定定位图标滑动隐藏效果
May 30 Javascript
elementUI 动态生成几行几列的方法示例
Jul 11 Javascript
详解javascript 变量提升(Hoisting)
Mar 12 #Javascript
NestJs 静态目录配置详解
Mar 12 #Javascript
JavaScript使用小插件实现倒计时的方法讲解
Mar 11 #Javascript
30分钟精通React今年最劲爆的新特性——React Hooks
Mar 11 #Javascript
记录一次完整的react hooks实践
Mar 11 #Javascript
es6数值的扩展方法
Mar 11 #Javascript
Vue实现一个图片懒加载插件
Mar 11 #Javascript
You might like
Windows中安装Apache2和PHP4权威指南
2006/11/18 PHP
PHP图片等比例缩放生成缩略图函数分享
2014/06/10 PHP
使用配置类定义Codeigniter全局变量
2014/06/12 PHP
PHP数学运算函数大汇总(经典值得收藏)
2016/04/01 PHP
thinkPHP批量删除的实现方法分析
2016/11/09 PHP
php正则判断是否为合法身份证号的方法
2017/03/16 PHP
PHP常见的几种攻击方式实例小结
2019/04/29 PHP
JS中的public和private对象,即static修饰符
2012/01/18 Javascript
常见的jQuery选择器汇总
2014/11/24 Javascript
jQuery插件pagewalkthrough实现引导页效果
2015/07/05 Javascript
BootStrap中jQuery插件Carousel实现轮播广告效果
2017/03/27 jQuery
原生js实现简单的模态框示例
2017/09/08 Javascript
weebox弹出窗口不居中显示的解决方法
2017/11/27 Javascript
原生JS实现的放大镜特效示例【测试可用】
2018/12/08 Javascript
Vue引入Stylus知识点总结
2020/01/16 Javascript
Python退火算法在高次方程的应用
2018/07/26 Python
使用python的pandas库读取csv文件保存至mysql数据库
2018/08/20 Python
python3 unicode列表转换为中文的实例
2018/10/26 Python
pycharm在调试python时执行其他语句的方法
2018/11/29 Python
python设计微型小说网站(基于Django+Bootstrap框架)
2019/07/08 Python
威尔逊皮革:Wilsons Leather
2018/12/07 全球购物
勿忘国耻9.18演讲稿(经典篇)
2014/09/14 职场文书
意外伤害赔偿协议书范文
2014/09/23 职场文书
部门群众路线教育实践活动对照检查材料思想汇报
2014/10/07 职场文书
竞聘报告优秀范文
2014/11/06 职场文书
2014初中数学教研组工作总结
2014/12/19 职场文书
关于成立领导小组的通知
2015/04/23 职场文书
党员证明模板
2015/06/19 职场文书
cf战队宣传语
2015/07/13 职场文书
2015秋季开学典礼致辞
2015/07/16 职场文书
反腐倡廉学习心得体会范文
2015/08/15 职场文书
任命书格式范文
2015/09/22 职场文书
2019年警察入党转正申请书最新范文
2019/09/03 职场文书
有关信念的名言语录集锦
2019/12/06 职场文书
oracle表分区的概念及操作
2021/04/24 Oracle
关于Mybatis中SQL节点的深入解析
2022/03/19 Java/Android