immutable日常操作之深入API

一、什么是Immutable collections

Immutable data cannot be changed once created . Persistent data presents a
mutative API which does not update the data in-place, but instead always yields
new updated data.

Immutable.js provides many Persistent Immutable data structures including:
List, Stack, Map, OrderedMap, Set, OrderedSet and Record.

These data structures are highly efficient on modern JavaScript VMs .

Keywords：cannot be changed，yields new updated data，efficient

Immutable数据结构一旦被创建就不会被修改，每次API的操作都会在此数据之上另外返回一个新的数据。同时他自身的API中提供了很多我们平时在工作中可能用到的数据结构，例如：List，Stack，Map...。

二、基本使用

2.1 npm方式

npm install immutable

调用：

const{Map}=require("immutable");

const map =Map({a:1,b:2,c:3});

map.get("a");// 1

2.2 浏览器方式

下载immutable.min.js，放在自己项目库文件中，然后引用：

<script src="immutable.min.js">

</script><script>

var map =Immutable.Map({a:1,b:2,c:3});

map.get("a");// 1

</script>

三、API

3.1 Collection

Immutable中的Collection是一个基类，放在后端语言Java中来说就是一个抽象类，其中定义了很多方法，提供给子类来实现。因此Collection不能直接使用其构造函数。其中它又分成了几个子类，分别是
Collection.Keyed,Collection.Indexed, or
Collection.Set，List/Map/Set/Stack分别都是继承他们而来。

提供的基本操作 (例如：get/set/update/map/filter之类的) 这里将不会被讲到，想要了解的可以具体去官网看API。

这里讲下equals和hashCode方法，这在javascript的几种数据中都不存在，是Immutable数据中特有的两个方法，用来判断两个数据的值是否相等。这里强调了"值"的概念。在Immutable中，所有的数据都是以values(值)的方式体现的。如果一个数据结构中，equals与hashCode方法返回的值相同，那么Immutable即认为它们值相等。这也是在Immutable中的is方法中有体现。

Also, an important relationship between these methods must be upheld: if two values are equal, theymustreturn the same hashCode. If the values are not equal, they might have the same hashCode; this is called a hash collision,

看到下面几行：

// src/is.js

exportfunctionis(valueA, valueB) {

//...

return!!(isValueObject(valueA) &&isValueObject(valueB) &&valueA.equals(valueB));

}

// src/Predicates.js

exportfunctionisValueObject(maybeValue) {

return!!(maybeValue &&

typeofmaybeValue.equals==="function"&&

typeofmaybeVaule.hashCode==="function");}

// src/CollectionImpl.js 315行

equals(other) {returndeepEqual(this, other);}// src/utils/deepEqual.jsexportdefaultfunctiondeepEqual(a, b) {

// 这里的算法略，如果感兴趣看是如何比较的可以自己去看

// 这里主要看一个关键词

// ...

if ( !isCollection(b) ||
(a.size!==undefined&&b.size!==undefined&&a.size!==b.size) ||
(a.__hash!==undefined&&b.__hash!==undefined&&a.__hash!==b.__hash)
// ...

) {

returnfalse;}

// 这里看到 __hash 这个属性从哪来，因此我们这回去看

}

// src/CollectionImpl.js 532行hashCode() {

returnthis.__hash|| (this.__hash=hashCollection(this));

}

所以，这里暴露了一些信息：使用is函数，需要比较hash值是否相等，那么用到hash值就必须调用hashCode函数，然后再进行具体值得比较，就会调用equals方法。

下面，我们来看几个is方法的例子：

const Immutable =require("./lib/immutable.js");

let a =1;

let b ="1";

let c =1;

let d ={a:1};

let e ={a:1};

let f =NaN;

let g =NaN;

let h =function() {console.log("h");}

let i =function() {console.log("h");}

let j =0;let k =-0;

let l =Immutable.Map({a:1});

let m =Immutable.Map({a:1});

let n ={

a:1,

hashCode:function() {

returnImmutable.hash("immutable");

},

equals:function() {

returntrue;

}

};

let o ={

a:1,

hashCode:function() {

returnImmutable.hash("immutable");

},

equals:function() {returntrue;

}

};

console.log(Immutable.is(a, b));// false

console.log(Immutable.is(a, c));// true

console.log(Immutable.is(d, e));// false

console.log(Immutable.is(f, g));// true

console.log(Immutable.is(h, i));// false

console.log(Immutable.is(j, k));// true

console.log(Immutable.is(l, m));// true

console.log(Immutable.is(n, o));// true

console.log(Immutable.isValueObject(n));// true

console.log(Immutable.isImmutable(n));// false

console.log(Immutable.isCollection(n));// false

总结：

1.对于javascript中原始值的比较类似于
Object.is需要注意的是：NaN在Immutable.js中认为是与自身相等的;+0和-0在Immutable.js中认为相等

2.对于Immutable中的集合类型，统一作为值比较。即当两个集合的值相等的时候即为相等

3.对于原始值对象，如果提供了hashCode以及equals方法，并且返回值相等，也会认为他们是相等的

中公优就业IT培训，总有你想学的：http://xue.ujiuye.com

勤工俭学计划，0元学IT!

http://www.ujiuye.com/zt/qgjx/?wt.bd=mmxtt

找工作太难?我们来帮你一举拿下!

http://www.ujiuye.com/zt/jycj/?=mmxtt

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！