loadsh的使用(真香系列)

Vue—loadsh的使用

loadsh就是一套函数方法化简得工具库，它内部封装了诸多对字符串、数组、对象等常见数据类型的处理函数，其中部分是目前ECMAScript尚未制订的规范，但同时被业界所认可的辅助函数。每天使用npm安装Lodash的数量在百万级以上，这在一定程度上证明了其代码的健壮性可用性，确实值得我们在项目中一试。

模块组成：

Array： 适合于数组类型，比如填充数据、查找元素、数组分片等操作
Collocation：适用于数组和对象类型，部分适用于字符串，比如分组、查找、过滤等操作
Function： 适用于函数类型，比如节流、延迟、缓存、设置钩子等操作
Lang： 普遍适用于各种类型，常用于执行类型判断和类型转换
Math： 使用与数值类型，常用于执行数学运算
Number： 适用于生成随机数，比较数值与数值区间的关系
Object： 适用于对象类型，常用于对象的创建、扩展、类型转换、检索、集合等操作
Seq： 常用于创建链式调用，提高执行性能（惰性计算）
String： 适用于字符串类型
lodash/fp 模块提供了更接近函数式编程的开发方法，其内部的函数经过包装，具有immutable、auto-curried、iteratee-first、data-last（官方介绍）等特点。
Fixed Arity：固化参数个数，便于柯里化
Rearragned Arguments： 重新调整参数位置，便于函数之间的聚合
Capped Iteratee Argument： 封装Iteratee参数

安装使用：

npm install --save lodash
npm install --save-dev babel-plugin-lodash

具体的使用方法：

import _ from ‘lodash’;
import { add } from ‘lodash/fp’;
const addOne = add(1);
_.map([8, 7, 4], addOne);

测试几个常用得使用方法：

循环8次：

//日常循环
for(var i =0 ;i<10;i++){
 //.....
}

//使用Array +一些循环方法 循环
Array.apply(null, Array(10)).forEach(function(){
    //...
});


//loadsh
_.times(10, function(){
    //...
});

深拷贝：

var objA = {
    "name": "job"
}

//loadsh
var objB = _.cloneDeep(objA);
objB === objA

随机数：

function getRandomNumber(min, max){
    return Math.floor(Math.random() * (max - min + 1)) + min;
}
getRandomNumber(15, 20);

//loadsh
_.random(15, 20);

筛选属性：

// Native method: Remove an array of keys from object
Object.prototype.remove = function(arr) {
    var that = this;
    arr.forEach(function(key){
        delete(this[key]);
    });
};

var objA = {"name": "colin", "car": "suzuki", "age": 17};

objA.remove(['car', 'age']);
objA; // {"name": "colin"}

// Lodash
objA = _.omit(objA, ['car', 'age']);
// => {"name": "colin"}
objA = _.omit(objA, "car");
// => {"name": "colin", "age": 17}
objA = _.omit(objA, _.isNumber);
// => {"name": "colin", "car": "suzuki"};

针对 JSON.parse 的错误处理：

function parse(str){
    try {
        return JSON.parse(str);
    }
    catch(e) {
        return false;
    }
}

// With Lodash
function parseLodash(str){
    return _.attempt(JSON.parse.bind(null, str));
}

parse('a');
// => false
parseLodash('a');
// => 一个错误得对象

parse('{"name": "colin"}');
// => Return {"name": "colin"}
parseLodash('{"name": "colin"}');
// => Return {"name": "colin"}