美文网首页基础前端
immutable lodash/fp ramda 对应的 删

immutable lodash/fp ramda 对应的 删

作者: CondorHero | 来源:发表于2019-08-10 21:50 被阅读0次

测试此三个库对数组的操作与原生 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 }

相关文章

  • immutable lodash/fp ramda 对应的 删

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

  • JS知识盲区

    Object.freeze negate函数 lodash ramda

  • Lodash/fp

    Lodash/fplodash的fp模块提供了实用的对函数式编程友好的方法提供了不可变auto-curried(已...

  • Lodash的FP模块

    前言:经常用Lodash的你,是否了解过它提供的FP模块?FP是啥 :FP(Functional Programm...

  • Ramda.js 入门

    1、前言 Ramda.js 是函数式编程领域中类似 lodash、underscore 的存在。在函数式编程流行的...

  • 前端开发中工具库

    前端开发中,经常用一些工具函数, 比如lodash underscore ramda 等库,这些库不只是封装了对数...

  • 函数式编程--Ramda 函数库学习

    一、Ramda的特点 1)Ramda 的数据一律放在最后一个参数,理念是"function first,data ...

  • immutable 入门基础

    immutable 基础入门 什么是immutable immutable(不可改变的)immutable是一种持...

  • lodash 常用

    uniapp使用lodash 安装lodash: npm i lodash -S

  • RxSwift快速指南(二)

    Transform 接触过FP的应该都知道map,RxSwift也提供对应的方法将Element进行变形,主要的方...

网友评论

    本文标题:immutable lodash/fp ramda 对应的 删

    本文链接:https://www.haomeiwen.com/subject/mqgkjctx.html