# lodash
# 1. 介绍
发音:
- low dash
文档:
# 2. get
语法:
lodash.get(object, path, [defaultValue])
作用:
- 获取对象属性的值
示例:
import get from 'lodash.get';
const person = { hobby: [ { name: 'football' } ] };
console.log( get(person, 'hobby[0].name') ); // 'football'
console.log( get(person, [ 'hobby', 0, 'name' ]) ); // 'football'
# 3. set
语法:
lodash.set(object, path, value)
作用:
- Sets the value at path of object
# 4. has
语法:
lodash.has(object, path)
作用:
- Checks if path is a direct property of object.
# 5. hasIn
语法:
lodash.hasIn(object, path)
作用:
- Checks if path is a direct or inherited property of object.
# 6. cloneDeep
语法:
lodash.cloneDeep(value)
作用:
- 深拷贝
# 7. merge
语法:
lodash.merge(object, [sources])
作用:
- 合并
# 8. debounce
语法:
lodash.debounce(func, [wait=0], [options={}])
作用:
- 防抖
bounce [baʊns]
# 9. throttle
语法:
lodash.throttle(func, [wait=0], [options={}])
options.trailing = true
, 等待时间结束后也会执行一次。(默认)
作用:
- 节流
[ˈθrɒtl]
使用:
const fn = () => {
console.log(Date.now());
};
// 三秒内,只执行一次。
const throttledFn = _.throttle(fn, 3 * 1000, { trailing: false });
setTimeout(throttledFn, 100);
setTimeout(throttledFn, 200);
setTimeout(throttledFn, 300);
# 10. isPlainObject
语法:
lodash.isPlainObject(value)
作用:
- Checks if value is a plain object, that is, an object created by the Object constructor or one with a
[[Prototype]]
of null.
# 11. once
语法:
once(func)
作用:
- 创建一个只能调用
func
一次的函数。 重复调用返回第一次调用的结果。 func
调用时,this
绑定到创建的函数,并传入对应参数。
示例:
var initialize = _.once(createApplication);
initialize();
initialize();
// `initialize` 只能调用 `createApplication` 一次。
// 在类中使用
class Test {
url = '/api/user';
getUserInfo = _.once(() => {
return axios.post(this.url);
});
}
# 12. template
语法:
template(str)
作用:
- 创建一个预编译模板方法,可以插入数据到模板中 "interpolate" 分隔符相应的位置。
示例:
// 使用 ES 分隔符代替默认的 "interpolate" 分隔符
var compiled = _.template('hello ${ user }!');
compiled({ 'user': 'pebbles' });
// => 'hello pebbles!'
示例2:(嵌入 JS 代码)
const template = require('lodash.template');
const compiled = template(`\
<ul>\
<% users.forEach(function(user) { %>
<li><%- user %></li>\
<% }); %>
</ul>\
`);
const html = compiled({ users: ['fred', 'barney'] });
console.log(html);
/* =>
<ul>
<li>fred</li>
<li>barney</li>
</ul>
*/
# 13. find
语法:
_.find(collection, [predicate=_.identity], [fromIndex=0])
说明:
- 从 列表 中查找对象,没找到返回
undefined
示例:
var users = [
{ 'user': 'barney', 'age': 36, 'active': true },
{ 'user': 'fred', 'age': 40, 'active': false },
{ 'user': 'pebbles', 'age': 1, 'active': true }
];
_.find(users, function(o) { return o.age < 40; });
// => object for 'barney'
// The `_.matches` iteratee shorthand.
_.find(users, { 'age': 1, 'active': true });
// => object for 'pebbles'
// The `_.matchesProperty` iteratee shorthand.
_.find(users, ['active', false]);
// => object for 'fred'
// The `_.property` iteratee shorthand.
_.find(users, 'active');
// => object for 'barney'
# 14. sortBy
说明:
- 返回数组副本
示例:
var users = [
{ 'user': 'fred', 'age': 48 },
{ 'user': 'barney', 'age': 36 },
{ 'user': 'fred', 'age': 40 },
{ 'user': 'barney', 'age': 34 }
];
_.sortBy(users, [function(o) { return o.user; }]);
// => objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 40]]
_.sortBy(users, ['user', 'age']);
// => objects for [['barney', 34], ['barney', 36], ['fred', 40], ['fred', 48]]
上一篇: 下一篇:
本章目录