lodash常用
1) Loop for N times
// 1. Basic for loop.
for(var i = 0; i < 5; i++) {
// ....
} // 2. Using Array's join and split methods
Array.apply(null, Array(5)).forEach(function(){
// ...
}); // Lodash
_.times(5, function(){
// ...
});
2) Loop through a collection and return a deeply-nested property from each item
// Fetch the name of the first pet from each owner
var ownerArr = [{
"owner": "Colin",
"pets": [{"name":"dog1"}, {"name": "dog2"}]
}, {
"owner": "John",
"pets": [{"name":"dog3"}, {"name": "dog4"}]
}]; // Array's map method.
ownerArr.map(function(owner){
return owner.pets[0].name;
}); // Lodash
_.map(ownerArr, 'pets[0].name');
3) Create an array of N size and populate them with unique values of the same prefix
// Create an array of length 6 and populate them with unique values. The value must be prefix with "ball_".
// eg. [ball_0, ball_1, ball_2, ball_3, ball_4, ball_5] // Array's map method.
Array.apply(null, Array(6)).map(function(item, index){
return "ball_" + index;
}); // Lodash
_.times(6, _.uniqueId.bind(null, 'ball_'));
4) Deep-cloning Javascript object
var objA = {
"name": "colin"
} // Normal method? Too long. See Stackoverflow for solution: http://stackoverflow.com/questions/4459928/how-to-deep-clone-in-javascript // Lodash
var objB = _.cloneDeep(objA);
objB === objA // false
5) Get Random Number between a range
// Get a random number between 15 and 20. // Naive utility method
function getRandomNumber(min, max){
return Math.floor(Math.random() * (max - min + 1)) + min;
} getRandomNumber(15, 20); // Lodash
_.random(15, 20);
6) Extending object
// Adding extend function to Object.prototype
Object.prototype.extend = function(obj) {
for (var i in obj) {
if (obj.hasOwnProperty(i)) {
this[i] = obj[i];
}
}
}; var objA = {"name": "colin", "car": "suzuki"};
var objB = {"name": "james", "age": 17}; objA.extend(objB);
objA; // {"name": "james", "age": 17, "car": "suzuki"}; // Lodash
_.assign(objA, objB);
Extending multiple objects
var objA = {"name": "colin", "car": "suzuki"};
var objB = {"name": "james", "age": 17};
var objC = {"pet": "dog"}; // Lodash
_.assign(objA, objB, objC)
// {"name": "james", "car": "suzuki", "age": 17, "pet": "dog"}
7) Removing properties from object
// Naive method: Remove an array of keys from object
Object.prototype.remove = function(arr) {
var that = this;
arr.forEach(function(key){
delete(that[key]);
});
}; var objA = {"name": "colin", "car": "suzuki", "age": 17}; objA.remove(['car', 'age']);
objA; // {"name": "colin"} // Lodash objA = _.omit(objA, ['car', 'age']); // {"name": "colin"}
More use-cases
var objA = {"name": "colin", "car": "suzuki", "age": 17}; // Lodash
objA = _.omit(objA, 'car'); // {"name": "colin", "age": 17};
objA = _.omit(objA, _.isNumber); // {"name": "colin"};
8) Select properties from another object to form new object
// Naive method: Returning a new object with selected properties
Object.prototype.pick = function(arr) {
var _this = this;
var obj = {};
arr.forEach(function(key){
obj[key] = _this[key];
}); return obj;
}; var objA = {"name": "colin", "car": "suzuki", "age": 17}; var objB = objA.pick(['car', 'age']);
// {"car": "suzuki", "age": 17} // Lodash
var objB = _.pick(objA, ['car', 'age']);
// {"car": "suzuki", "age": 17}
9) Selecting a random item from a list
var luckyDraw = ["Colin", "John", "James", "Lily", "Mary"]; function pickRandomPerson(luckyDraw){
var index = Math.floor(Math.random() * (luckyDraw.length));
return luckyDraw[index];
} pickRandomPerson(luckyDraw); // John // Lodash
_.sample(luckyDraw); // Colin
10) Error handling for JSON.parse
// Using try-catch to handle the JSON.parse error
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'); // Return an error object parse('{"name": "colin"}'); // Return {"name": "colin"}
parseLodash('{"name": "colin"}'); // Return {"name": "colin"}
lodash常用的更多相关文章
- lodash常用函数 - Array、Collection
lodash常用函数 - Array.Collection lodash版本 v3.10.1 1.Array.Collection pull 移除数组中满足条件的元素 var array = [1, ...
- Lodash 常用API中文参考
lodash和underscore都是现在非常流行的两个javascript库,提供了一套函数式编程的实用功能. 而lodash本身最初也是underscore的一个fork,因为和其他(Unders ...
- 函数式编程 lodash 常用api
1.forEach _.forEach({ 'a': 1, 'b': 2 }, function(value, key) { console.log(key); }); _.forEach([3,4] ...
- [转] Lodash常用API笔记
原生用法 直接使用的API _.reject 根据条件去除某个元素. var foo = [ {id: 0, name: "aaa", age: 33}, {id: 1, name ...
- lodash
lodash常用函数一 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...
- lodash 工具库
lodash是一套工具库,内部封装了很多字符串.数组.对象等常见数据类型的处理函数. 1.lodash的引用 import _ from 'lodash' 用一个数组遍历来说明为什么要使用lodash ...
- Lodash.js常用拷贝
lodash.js 降低 array.number.objects.string 等等的使用难度从而让 JavaScript 变得更简单.非常适用于:遍历 array.object 和 string: ...
- lodash 中常用的方法
odash是js集Array/Object/String/Function的Util于一身. lodash打包了Array/Object/String/Function里一些Api,好处是连ES6的也 ...
- Node填坑教程——常用库
作为函数式编程来说,流程控制和函数库是必不可少的(应该吧). 下面我们介绍两个常用的库. lodash:完整的api请参阅,https://lodash.com/docs.这里我们只演示几个简单的例子 ...
随机推荐
- python模块之sys
sys.argv 命令行参数List,第一个元素是程序本身路径 sys.exit(n) 退出程序,正常退出时exit(0) sys.version 获取Python解释程序的版本信息 sys.maxi ...
- selenium2常用API介绍
我们模拟web操作都是基于元素来操作的,我们首先要先确定元素,然后这个元素下对应的方法就可以看WebElement的方法. 1.点击操作 WebElement button=driver.findEl ...
- HDU4010 Query on The Trees (LCT动态树)
Query on The Trees Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 65768/65768 K (Java/Othe ...
- mysql PacketTooBigException 的处理方式
SHOW VARIABLES LIKE '%max_allowed_packet%'; set global max_allowed_packet = 2*1024*1024*1000
- react技术栈实践(2)
本文来自网易云社区 作者:汪洋 这时候还没完,又有两个问题引出来了. 按照上面的配置,第三方库 antd 竟然也被编译了,导致样式失败. react中,一旦包裹了子组件,子组件没办法直接使用 styl ...
- Oracle 表空间的日常维护与管理
目录 Oracle 表空间的日常维护与管理 1.创建数据表空间 2.创建临时表空间 3.创建 UNDO 表空间 4.表空间的扩展与修改大小 5.表空间重命名 6.表空间的删除 7.更改表空间的读写模式 ...
- Selenium WebDriver- 操作frame中的页面元素
#encoding=utf-8 import unittest import time from selenium import webdriver from selenium.webdriver i ...
- Flask_Blueprint(蓝图)
在Flask中,我们需要一个可以模块化的方法. Flask自身给我们提供的就是Blueprint方法. 通过Blueprint,可以让我们实现模块化组织程序结构. 官方文档解释: 代码结构: 核心代码 ...
- 微信小程序开发 -- 点击右上角实现转发功能
// 在page的js文件中加入以下代码/** * 用户点击右上角分享 */ onShareAppMessage: function () { }
- Spring_mvc的搭建以及实现
Spring MVC属于SpringFrameWork的后续产品,已经融合在Spring Web Flow里面.Spring 框架提供了构建 Web 应用程序的全功能 MVC 模块.使用 Spring ...