小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
前言
上篇,我们罗列了数组的所有方法,属于基础篇,今天来一起看看数组的高级用法吧。
大家,动起来。
去空值
Array.prototype.filter
用于过滤数据,有时候要去掉哪些空值,怎么办呢?
传入一个Boolean
就行,我们看到后面的打印, 其也是一个函数, 相当于让值转为布尔值,真值被保留, 非真值被丢弃。当然,使用的时候,你要清晰知道数组元素的类型。
下面的情况可以发生意外:
- 纯数字数组,里面包含0
- 混合类型数组,有数字,对象,null, undefined, 空字符串等等
- 其他情况
var arr = [{name:"tom", age: 18}, { name: "pik"},undefined];
const newArr = arr.filter(Boolean)
// 打印Boolean
console.log(Boolean)
// ƒ Boolean() { [native code] }
还是那句话,特定情况下,特定的作用。
生成随机数组或者序列生成器
生成随机数组,当然你可以采用for
循环,代码会相对多一些,数组这里就有妙招了。
一行代码获取限定数据的随机数:
const createRandomValues = Array.from({length:10}, (v,i)=> Math.random());
// [0.25940121194082666, 0.8386585479250679, 0.26516411790325556, 0.6017479968140447,
//0.5730002277371962, 0.8710995725057937, 0.18703989792580744,
//0.7930248062519736, 0.4589973173040094, 0.2985306917392727]
我们再抽象一下, 万能的数据制造器,就这么简单。
const createRandomValues = (creator, length = 10) => Array.from({length}, creator)
const values = createRandomValues(Math.random)
//[0.4296594057567271, 0.175596004994798, 0.9947572646883405, 0.8956806916112903,
//0.6601653932078315, 0.0020614027979746208, 0.3662092630842637, 0.39965167430505866,
//0.4124746706358795, 0.6975065159343525]
我们基于此,搞一个序列生成器:
const createRandomValues = (creator, length = 10) => Array.from({length}, creator);
const createRange = (start, stop, step) =>
createRandomValues((_, i) => start + (i * step), (stop - start) / step + 1)
createRange (1,100,3) // [1, 4, 7, 10]
当然,Array.from还可以用来复制数组和把类数组转为数组,多一些关爱,就多一些可爱。
清空数组
这就有请我们的大杀器Array.prototye.splice
,
清空数组, 你是不是喜欢直接赋值给一个新的[]
呢,其实有更好的选择, 这样并没有创新新的数据, 她依旧还是那个她。
var arr = [1,2,3];
arr.splice(0);
console.log(arr); // []
当然直接设置length
属性为0也是可以的。
var arr = [1,2,3];
arr.length = 0
console.log(arr); // []
数组浅拷贝
方式一Array.prototype.slice
var arr = [{a:1}, {a:2}]
var arr2 = arr.slice(0);
console.log(arr); // [{a:1}, {a:2}]
console.log(arr2); // [{a:1}, {a:2}]
console.log(arr == arr2);
方式二Array.from
var arr = [{a:1}, {a:2}]
var arr2 = Array.from(arr);
console.log(arr); // [{a:1}, {a:2}]
console.log(arr2); // [{a:1}, {a:2}]
console.log(arr == arr2);
当然,拓展运算符也可以。
小结
今天我们学习了去空值,生成随机数据和序列, 清空数组,数组浅拷贝。
今天你收获了吗?