immutable lodash/fp ramda 对应的 删 filter 改 map 增加 ...

测试此三个库对数组的操作与原生 JS 对数组的操作尤其是 删 filter 改 map 增加 ... 这句金句对比一下。

一、immutable

immutable - npm https://www.npmjs.com/package/immutable
Set — Immutable.js https://immutable-js.github.io/immutable-js/docs/#/Set

全部不对原数组进行操作，只返回新的值。

var immutable = require('immutable');

var arr1 = ['A', 'B', 'C', 'D'];
//类比ES6高级语法增加...
var arr2 = immutable.fromJS(arr1).push('E').toJS();
// 类比ES6的filter
var arr3 = immutable.fromJS(arr1).splice(2, 1).toJS();
// 类比ES6的map
var arr3 = immutable.fromJS(arr1).set(2, "M").toJS();

console.log(arr1);
console.log(arr2);
console.log(arr3);
// 打印结果
// [ 'A', 'B', 'C', 'D' ]
// [ 'A', 'B', 'C', 'D', 'E']
// [ 'A', 'B', 'M', 'D' ]

二、lodash/fp

var _ = require('lodash/fp');

// 不改变原数组
// 对应ES6的map
var arr1 = ["A","B","C","D","E"];
// 操作的时候必须有一个挂载点,首字母改变为"M"
var arr2 = _.set(0, "M", arr1);

console.log(arr1);
console.log(arr2);
// 打印效果
// [ 'A', 'B', 'C', 'D', 'E' ]
// [ 'M', 'B', 'C', 'D', 'E' ]

// 对应ES6的...
var arr3 = _.set(arr1.length, "末尾", arr1);
console.log(arr3);
// [ 'A', 'B', 'C', 'D', 'E', '末尾' ]

// filter 删除第一项
var arr =  [
        {'id': 1, 'name': '小明', 'age': 18},
        {'id': 2, 'name': '小红', 'age': 19},
        {'id': 3, 'name': '小强', 'age': 20}
    ];
var arr4 = _.filter(item => item.id!==1,arr)
console.log(arr)
console.log(arr4)
// 打印结果
// [ { id: 1, name: '小明', age: 18 },
//   { id: 2, name: '小红', age: 19 },
//   { id: 3, name: '小强', age: 20 } ]
// [ { id: 2, name: '小红', age: 19 },
//   { id: 3, name: '小强', age: 20 } ]




// 对象的改变采用k来索引
var obj1 = {'a': 8, 'b': 3, 'c': 4};
var obj2 = _.set('b', 113, obj1);

console.log(obj1);
console.log(obj2);

// 打印效果
// { a: 8, b: 3, c: 4 }
// { a: 8, b: 113, c: 4 }

三、ramda

var R = require('ramda');

var arr1 = ['A', 'B', 'C', 'D'];
// 对应ES6的...
var arr2 = R.insert(arr1.length, 'E', arr1);
// 对应ES6的filter
var arr3 = R.filter(item => item !== 'C', arr1);
// 对应ES6的filter
var arr4 = R.remove(0, 1, arr1);
// 对应ES6的map
var arr5 = R.update(1, "M", arr1);

console.log(arr1);
console.log(arr2);
console.log(arr3);
console.log(arr4);
console.log(arr5);
// 打印结果
// [ 'A', 'B', 'C', 'D' ]
// [ 'A', 'B', 'C', 'D', 'E' ]
// [ 'A', 'B', 'D' ]
// [ 'B', 'C', 'D' ]
// [ 'A', 'M', 'C', 'D' ]

var obj1 = {'a': 1, 'b': 2, 'c': 3};
var obj2 = R.set(R.lensProp('b') ,8 , obj1);

console.log(obj1);
console.log(obj2);
// 打印结果
// { a: 1, b: 2, c: 3 }
// { a: 1, b: 8, c: 3 }