一边学习前端,一边通过博客的形式自己总结一些东西,当然也希望帮助一些和我一样开始学前端的小伙伴。
如果出现错误,请在评论中指出,我也好自己纠正自己的错误
此文是连接我之前的一篇总结文章,可以去我主页搜索
author: thomaszhou
- 7. 一维、二维、多维数组的最值求解
- 8. 数组内部元素随机排列
- 9.数组求和、平均值、数组中指定值的出现次数
- 10. 找出数组间不同项-相同项
- 11. 过滤数组中的非唯一值
- 12数组合并
- 13. flatten深度展开数组-降为
- 14. 获得第n个斐波那契数字
- 15. 一些简单的应用(简单的内置函数用法)
一到多维数组的最值求解
-
1.6.1 一维数组的最值
-
for循环或者foreach(比for快点)
- 不讨论for放啊
-
forEach方法
复制代码
- reduce方法来求解
复制代码
-
1.6.2二维数组的最值
双层for循环是最简单的方法,
- 比较好的思路是
- step1:先得出每个子数组的最大值
- step2:然后找出这些数的最大值
- 方法一(map,reduce,Math.max()):
var arr2 = [[1,20,5],[3,45,564],[34,12]];
var newMap1 = arr2.map(function (item) {
//map是遍历最外层,item就是每个子数组
return item.reduce(function (preVal, curVal) {
//对每个子数组item进行求出最值的操作,并返回
return preVal > curVal ? preVal: curVal;
})
});
console.log(newMap1);//[20,564,34]
//Math.max求出最值
console.log(Math.max(...newMap1));//564
复制代码
-
step1: 在外层数组中使用Array.prototype.map()方法遍历数组。
-
step2: 使用map()方法遍历数组,会调用一个回调函数,在这个回调函数中, 使用reduce()方法对每个子数组group进行合并,将值返回到一个新数组中。
-
step3: 而在使用reduce()方法时,同样会调用一个回调函数,这个回调函数只做了一件事情, 就是子数组中的元素做为比较,如果curVal大于preVal,将会返回current, 否则返回prev,最终得到每个子数组中最大值
-
方法二(最佳)---目前没看懂
var arr2 = [[1,20,5],[3,45,564],[34,12]];
function largestOfFour (arr) {
return arr.map(Function.apply.bind(Math.max, null));
}
console.log(largestOfFour(arr2)); //[20, 564, 34]
复制代码
这个方案,使用Function.bind方法创建一个特殊的回调函数,就类似于Math.max方法一样,但其有一个Function.prototype.apply功能,将数组作为它的参数。
-
先对主数组中的每个元素做遍历,也就是数组内部的每个子数组
-
使用map()方法需要一个回调函数,用来找出内部每个数组中的最大值。需要创建一个函数,让Math.max能接受输入的数组工作。换句话说,这是非常简单而且这样工作也非常的好,如Math.max([9,43,20,6]);将会返回最大值43
-
Function.prototype.apply方法工作可以接受数组做为参数,但函数通过调用上下文,这事情就有点复杂。例如Math.max.apply(null,[9,43,20,6])将调用一个Max.max方法,但这样的方法找起来不容易。
-
这里给Function.prototype.apply方法传递了一个null参数,告诉Math.max不需要任何上下文。
-
因为arr.map()需要一个回调函数,而不只是一个表达式,我们在Function.bind方法中提供了一个函数
-
因为Function.prototype.apply是一个静态方法,类似一个函数对象,我们可以称之为Function.prototype.apply上绑定了一个Function.prototype.bind。例如: Function.apply.bind
-
现在可以通过Function.prototype.apply.bind回调函数指定其上下文,比如在这个示例中的Math.max方法
-
由于是嵌入到Function.prototype.apply方法,需要一个上下文作为第一个参数,而且这个上下文还是一个虚假的。
-
所以我们将null作为第二个参数传递给Function.prototype.apply.bind,并且绑定一个上下文,这个上下文就是Math.max方法
-
由于Math.max是独立于任何上下文的,所以它会忽略Function.prototype.apply方法调用的虚假上下文
-
我们使用Function.prototype.apply.bind(Math.max,null)让一个新函数接受arr.map值,比如数组中的子数组
-
很巧妙的方法!!!!!!!!也是多位数组的方法
var arr2 = [[1,20,5],[3,45,564],[34,12]];
var new1 = function (arr) {
// 通过join先把数组里面的值用,拼接成字符串
// 用split将字符串拼接为数组
return arr.join(',').split(',');
}(arr2)
// console.log(largestOfFour(arr2));
console.log(Math.max(...new1));//564
复制代码
-
1.3.3 多维数组最值
上文使用不同的方法实现了从二维数组中取出子数组中最大值,并且将这些最大值重新组成一个新数组,如果延伸一下,取出里面的最大值时,还需要使用Array.prototype.max函数,函数中通过Math.max.apply({},this)取得最大值。不过如果不是二维数组,那上述方法将无法取出数组中最大的值。
- 而在多维数组中取最大值,可以通过join()和split()方法组合在一起:
var arr2 = [333,[3,45,564],[34,12,[1,4000]]];
var new1 = function (arr) {
// 通过join先把数组里面的值用,拼接成字符串
// 用split将字符串拼接为数组
return arr.join(',').split(',');
}(arr2)
// console.log(largestOfFour(arr2));
console.log(Math.max(...new1));//4000
复制代码
数组内部元素随机排列
var arr = [1,2,3,4,5,7,8,9]
arr.sort(function () {
return Math.random() - 0.5
})
复制代码
计数数组中值的出现次数
数组平均数(其实就是数组求和)
使用reduce()将每个值添加到累加器,初始值为0,总和除以数组长度。
const average = arr => arr.reduce((pre, cur) => pre + cur, 0) / arr.length;
// 箭头函数,如果函数只有一条语句,不要加"{}"和 ";"
// average([1,2,3]) -> 2
复制代码
计数数组中值的出现次数
每次遇到数组中的特定值时,使用reduce()来递增计数器。
const arrayCount = (arr, value) => {
let count = 0;
arr.forEach(val => {
val === value? count += 1: count += 0;
});
return count;
}
console.log(arrayCount([1,1,2,3,4], 1)); // 2
复制代码
或者reduce方法
const countOccurrences = (arr, value) => arr.reduce((a, v) => v === value ? a + 1 : a + 0, 0);
// countOccurrences([1,1,2,1,2,3], 1) -> 3
复制代码
找出数组间不同项-相同项
找出数组a中除数组b以外的值
从b创建一个Set,然后在a上使用Array.filter(),只保留b中不包含的值。
es6: Set结构的has方法,是用来查找值的
const difference = (a, b) => {
let s = new Set(b);
return a.filter(x => !s.has(x));
}
console.log(difference([1,2,3], [1,2]));//[3]
复制代码
找出数组间不同项-相同项(或者说交集)
上面是 !s.has(x)),如果改成s.has(x)),那就是求数组a中和数组b的交集
const difference = (a, b) => {
let s = new Set(b);
return a.filter(x => s.has(x));//将!去掉了
}
console.log(difference([1,2,3,2], [1,2,4,2]));//[1, 2, 2]
复制代码
过滤数组中的非唯一值
6. 数组去重、合并数组去重(和11相似)
- 将Array.filter()用于仅包含唯一值的数组。
- 思路:indexOf和lastIndexOf找的位置相同,那就是唯一的值
const arrayIntersection = arr => arr.filter(i => arr.indexOf(i) === arr.lastIndexOf(i));
// console.log(arrayIntersection([1,2,2,3,4,4,5])); // [1,3,5]
复制代码
数组合并
const arrayConcat = (arr, ...args) => {
let array = arr.concat(...args);
return array;
};
console.log(arrayConcat([1], [2,6], 5, [[2],10])); // [1, 2, 6, 5, [2], 10]
复制代码
缺点:只能将二维数组降成一维,如上面[2]就是二维数组
这就联系到深度展开数组的操作,看下面的flatten深度展开数组
flatten深度展开数组
其实就是数组降维:将嵌套多层的数组(嵌套可以是任何层数)转换为只有一层的数组
-
方法一:
let arr = [1,[2],[[[3,[10]],4],5]];
let newArr = [];
function changeArr(arr){
for(var i=0;iforEach
if(arr[i] instanceof Array){
//判断元素是否为数组
changeArr(arr[i])
//元素为数组则继续调用changeArr方法遍历
}else{
newArr.push(arr[i])
//元素不是数组则可以直接push进新数组
}
}
//此上的判断也可以直接用三元表达式
}
changeArr(arr);
console.log(newArr); // [1, 2, 3, 10, 4, 5]
复制代码
-
方法2(可多维):指定降维层数
使用递归去递减深度。使用 Array.reduce() 和 Array.concat() 来合并元素或数组。基本情况下,当深度为 1 时停止递归。省略第二个参数,展开深度为 1。
const flattenDepth = (arr, depth = 1) =>
depth != 1 ? arr.reduce((a, v) => a.concat(Array.isArray(v) ? flattenDepth(v, depth - 1) : v), [])
: arr.reduce((a, v) => a.concat(v), []);
// 降2维
console.log(flattenDepth([1,[2],[[[3],4],5]], 2)); // [1,2,[3],4,5]
// 降3维
console.log(flattenDepth([1,[2],[[[3],4],5]], 3)); // [1, 2, 3, 4, 5]
复制代码
-
方法3(可高维):缺点是得到的值变成了字符形式
数组中元素仅基本类型的元素或数组,可以转换为字符串,不存在循环引用的情况。
function flatten(arr) { return arr.toString().split(',')}
// arr.toString() 结果是字符串形式的1,2,3,4
console.log(flatten([1,[2],[[3]], [[[4]]]])) //["1", "2", "3", "4"]
复制代码
解决办法:最后再遍历一遍数组,用Number转化为数字!
获得第n个斐波那契数字
斐波那契数列是0、1、1、2、3、5、8、13、21、34...
- 思路:构建一个长度为n的斐波那契数列,然后将最后一个值返回
这个是迭代方式,递归方法太耗时
function fibonacci(n) {
let fibo = [0, 1];
if (n < 2) {
return n;
}
for (let i = 2; i <= n; i++) {
fibo.push(fibo[i-1] + fibo[i-2]);
}
return fibo[n];
}
console.log(fibonacci(0)); // 0
console.log(fibonacci(1)); // 1
console.log(fibonacci(6)); // 8
复制代码
一些简单的应用
数组去掉最后n个值
其实就是去掉最后n个值,利用arr.slice(0,-1)。以0为起点,去一个是-1,去两个是-2,以此类推,
const initial = arr => arr.slice(0, -1);
// initial([1,2,3]) -> [1,2]
复制代码
用值初始化数组
使用Array(n)创建所需长度的数组,fill(v)以填充所需的值,可以忽略value使用默认值0。
const initializeArray = (n, value = 0) => Array(n).fill(value);
// initializeArray(5, 2) -> [2,2,2,2,2]
复制代码
Initialize array with range (使用指定范围来定义数组)
使用 Array(end-start) 创建一个所需长度的数组,使用 Array.map() 来填充范围中的所需值。 你可以省略start,默认值为 0。
const initializeArrayRange = (end, start = 0) =>
Array.apply(null, Array(end - start)).map((v, i) => i + start);
// initializeArrayRange(5) -> [0,1,2,3,4]
复制代码
数组的最后
返回arr.slice(-1)[0]
const last = arr => arr.slice(-1)[0];
//arr.slice(-1)得到的是数组[3]
console.log(last([1,2,3])); // 3
复制代码
获取数组的第 N 个元素
使用 Array.slice() 得到一个包含第一个元素的数组。 如果索引超出范围,则返回 []。(译者注:超过索引返回 undefind) 省略第二个参数 n 来获取数组的第一个元素。
const nth = (arr, n=0) => (n>0? arr.slice(n,n+1) : arr.slice(n))[0];
// nth(['a','b','c'],1) -> 'b'
// nth(['a','b','b']-2) -> 'a'
复制代码