紧接,讲到baseDifference方法中,遇到数组长度较大(大于200)时,用setCache方法来存储数据,今天我们就来看一看setCache到底做了什么,这对于今后我们遇到大量数据存取的时候有一定借鉴意义。
import MapCache from './MapCache.js' /** Used to stand-in for `undefined` hash values. */const HASH_UNDEFINED = '__lodash_hash_undefined__' class SetCache { /** * Creates an array cache object to store unique values. * * @private * @constructor * @param {Array} [values] The values to cache. */ constructor(values) { let index = -1 const length = values == null ? 0 : values.length this.__data__ = new MapCache while (++index < length) { this.add(values[index]) } } /** * Adds `value` to the array cache. * * @memberOf SetCache * @alias push * @param {*} value The value to cache. * @returns {Object} Returns the cache instance. */ add(value) { this.__data__.set(value, HASH_UNDEFINED) return this } /** * Checks if `value` is in the array cache. * * @memberOf SetCache * @param {*} value The value to search for. * @returns {number} Returns `true` if `value` is found, else `false`. */ has(value) { return this.__data__.has(value) }} SetCache.prototype.push = SetCache.prototype.add export default SetCache复制代码
setCache这个class主要是对MapCache的二次封装,在constructor中new MapCache,然后基于这个实例的add和has方法其实都是来自于MapCahe,这里还加了一个alias(push即为add)。
这个class中一个需要注意的地方是第19行的new MapCache,一般来说,我们都会写new MapCahe(),那加不加括号有什么区别呢?其实是优先级的区别,new 的运算优先级要小于 . 的运算优先级,现在这种情况下两种写法是一样的,但是new MapCache.add()和new MapCache().add()就会有区别,前者会报错,因为他会先执行MapCache.add,然后再执行new。 接着来看MapCache吧。import Hash from './Hash.js' /** * Gets the data for `map`. * * @private * @param {Object} map The map to query. * @param {string} key The reference key. * @returns {*} Returns the map data. */function getMapData({ __data__ }, key) { const data = __data__ return isKeyable(key) ? data[typeof key == 'string' ? 'string' : 'hash'] : data.map} /** * Checks if `value` is suitable for use as unique object key. * * @private * @param {*} value The value to check. * @returns {boolean} Returns `true` if `value` is suitable, else `false`. */function isKeyable(value) { const type = typeof value return (type == 'string' || type == 'number' || type == 'symbol' || type == 'boolean') ? (value !== '__proto__') : (value === null)} class MapCache { /** * Creates a map cache object to store key-value pairs. * * @private * @constructor * @param {Array} [entries] The key-value pairs to cache. */ constructor(entries) { let index = -1 const length = entries == null ? 0 : entries.length this.clear() while (++index < length) { const entry = entries[index] this.set(entry[0], entry[1]) } } /** * Removes all key-value entries from the map. * * @memberOf MapCache */ clear() { this.size = 0 this.__data__ = { 'hash': new Hash, 'map': new Map, 'string': new Hash } } /** * Removes `key` and its value from the map. * * @memberOf MapCache * @param {string} key The key of the value to remove. * @returns {boolean} Returns `true` if the entry was removed, else `false`. */ delete(key) { const result = getMapData(this, key)['delete'](key) this.size -= result ? 1 : 0 return result } /** * Gets the map value for `key`. * * @memberOf MapCache * @param {string} key The key of the value to get. * @returns {*} Returns the entry value. */ get(key) { return getMapData(this, key).get(key) } /** * Checks if a map value for `key` exists. * * @memberOf MapCache * @param {string} key The key of the entry to check. * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`. */ has(key) { return getMapData(this, key).has(key) } /** * Sets the map `key` to `value`. * * @memberOf MapCache * @param {string} key The key of the value to set. * @param {*} value The value to set. * @returns {Object} Returns the map cache instance. */ set(key, value) { const data = getMapData(this, key) const size = data.size data.set(key, value) this.size += data.size == size ? 0 : 1 return this }} export default MapCache复制代码
结合clear、set和getMapData方法可以看出,根据不同的key值,有三种存储的数据类型。如果key是string,number,boolean,symbol中的一种,并且不是__proto__(要么直接是null也行),那么就用hash|string类型,也就是自己封装的Hash来存储,否则就用js自身的Map类型来存储,为什么要分这三种情况呢,我们来看一下object和map的区别,区别主要有以下五点:
- 一个Object的键只能是string或者symbol,但一个 Map 的键可以是任意值,包括函数、对象、基本类型。
- Map 中的键值是有序的,而添加到对象中的键则不是。因此,当对它进行遍历时,Map 对象是按插入的顺序返回键值。
- 你可以通过 size 属性直接获取一个 Map 的键值对个数,而 Object 的键值对个数只能手动计算。
- Map 可直接进行迭代,而 Object 的迭代需要先获取它的键数组,然后再进行迭代。
- Object 都有自己的原型,原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。虽然 ES5 开始可以用 map = Object.create(null) 来创建一个没有原型的对象,但是这种用法不太常见。 Map 在涉及频繁增删键值对的场景下会有些性能优势。
这里主要是考虑了第一条,注意Object的键只能是string或者symbol不是说当你设置这个object的key为string或者symbol时会报错,而是当你用function或者对象作为key值时,他会自动先转化为string。
为什么要用Map类型我们应该已经知道了,那么Hash类型是啥,又是如何实现的,我们等下来看,这里其实主要是对这三种类型进行了判断,然后每个方法都是调用对应class(Map或Hash)的实例方法,包括get,set,has,delete等方法。
我们接着看lodash自己定义的Hash。
/** Used to stand-in for `undefined` hash values. */const HASH_UNDEFINED = '__lodash_hash_undefined__' class Hash { /** * Creates a hash object. * * @private * @constructor * @param {Array} [entries] The key-value pairs to cache. */ constructor(entries) { let index = -1 const length = entries == null ? 0 : entries.length this.clear() while (++index < length) { const entry = entries[index] this.set(entry[0], entry[1]) } } /** * Removes all key-value entries from the hash. * * @memberOf Hash */ clear() { this.__data__ = Object.create(null) this.size = 0 } /** * Removes `key` and its value from the hash. * * @memberOf Hash * @param {Object} hash The hash to modify. * @param {string} key The key of the value to remove. * @returns {boolean} Returns `true` if the entry was removed, else `false`. */ delete(key) { const result = this.has(key) && delete this.__data__[key] this.size -= result ? 1 : 0 return result } /** * Gets the hash value for `key`. * * @memberOf Hash * @param {string} key The key of the value to get. * @returns {*} Returns the entry value. */ get(key) { const data = this.__data__ const result = data[key] return result === HASH_UNDEFINED ? undefined : result } /** * Checks if a hash value for `key` exists. * * @memberOf Hash * @param {string} key The key of the entry to check. * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`. */ has(key) { const data = this.__data__ return data[key] !== undefined } /** * Sets the hash `key` to `value`. * * @memberOf Hash * @param {string} key The key of the value to set. * @param {*} value The value to set. * @returns {Object} Returns the hash instance. */ set(key, value) { const data = this.__data__ this.size += this.has(key) ? 0 : 1 data[key] = value === undefined ? HASH_UNDEFINED : value return this }} export default Hash复制代码
可以看到,其实Hash就是创建了一个空对象,然后基于这个对象来维护他的get,set,has等方法。
这里值得一提的是Object.create(null),我们应该知道Object.create方法本身是创建一个新对象,使用现有的对象来提供新创建的对象的__proto__,Object.create(null)创建的对象的__proto__就是null,和{}最大的区别在于,{}(也就是new Object())他其实是Object的一个实例,所以他是有对象的实例方法的,而Object.create(null)创建的对象是没有实例方法的,如obj.hasOwnProperty之类的方法都不能调用。总结:目前为止,基本上我们已经可以对lodash的cache有一个完整的认识了,当需要维护的数组很大时,就采用map或者hash(自定义的对象)来进行代替,其实也就是我们常说的空间换时间,虽然占用内存较大,但每次的存取都会比较快。