arrify 转数组

·  阅读 37

本文参加了由@若川视野 发起的每周源码共读活动,   点击了解详情一起参与。

源码内容

	if (value === null || value === undefined) {
		return [];
	}

	if (Array.isArray(value)) {
		return value;
	}

	if (typeof value === 'string') {
		return [value];
	}

	if (typeof value[Symbol.iterator] === 'function') {
		return [...value];
	}

	return [value];
}
复制代码

源码使用

arrify 作用: 将一个值转换成数组的格式
安装:npm install arrify
 
arrify 转数组 
 
复制代码

1, 若 value 为 null 或 undefined,则返回空数组 使用 === 全等来实现, === 是全等, == 是相等,特别需要注意的是 == 是可以值相同但是类型不同的, 比如

let a = 1 ; console.log( a == '1') // true

, 但是 === 是必须值和类型都需要相同才会返回true

let a = 1 ; console.log( a === '1')// false

2, 若 value 为数组,则返回 value 本身
使用 Array.isArray 判断value 是不是 一个 Array

Array.isArray([1, 2, 3]);  // true
Array.isArray({foo: 123}); // false
Array.isArray('foobar');   // false
Array.isArray(undefined);  // false
复制代码

3,若 value 为字符串,则返回由 value 组成的长度为 1 的数组 使用typeof 判断是不是字符串
typeof 注意 如果一个值 是null 返回的不是一个 null 值,而是一个object

console.log(typeof null) //  object
console.log(typeof undefined)//undefined
复制代码

4,使用了ES 6 引入了一种新的原始数据类型Symbol。 对象的Symbol.iterator属性,指向该对象的默认遍历器方法。 对象进行for...of循环时,会调用Symbol.iterator方法,返回该对象的默认遍历器

class Collection {
*[Symbol.iterator]() {
 let i = 0;
 while(this[i] !== undefined) {
   yield this[i];
   ++i;
 }
}
}

let myCollection = new Collection();
myCollection[0] = 1;
myCollection[1] = 2;

for(let value of myCollection) {
console.log(value);
}
// 1
// 2
复制代码

typeof value[Symbol.iterator] === 'function' 感觉是去判断该值是不是可迭代对象,让后去for ... of 对象

  • [...value]这里的扩展运算符(...)会调用默认的 Iterator 接口 console.log([...'a,b,c']) // [a, b, c ]
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改