学习lodash,一篇文章就够了

安装

npm i lodash -D

然后在使用的vue组件里边

<script>
 
import _ from ‘lodash'
 
export default{} 
 
</script>

一、Array的一些常用方法的总结:

_.compact(array)

compact的中文意思是“紧凑的”

去假,例如false, null, 0, “”, undefined

_.compact([0, 1, false, 2, '', 3]);

// => [1, 2, 3]


```javascript
_uniq(array)

创建一个去重后的array数组副本

```javascript
_.uniq([2, 1, 2]);

// => [2, 1]
上边这俩总结为“紧凑”和“去重”

_.remove(array,[predicate=_.identity])

“搬除”原数组中满足判断条件的值,返回一个搬除数组,当然原来的数组也变化了,元素被搬走了

var array = [1, 2, 3, 4];
 
var evens = _.remove(array, function(n) {
 
  return n % 2 == 0;
 
});
 
console.log(array);
 
// => [1, 3]
 
console.log(evens);
 
// => [2, 4]
_.join(array,[seperator=,])

然后这个是“拼接”,按一定符号拼接数组为字符串

_.join(['a', 'b', 'c'], '~');
 
// => 'a~b~c'
_.slice(array,[start],[end])

“裁剪”数组array,从 start 位置开始到end结束,但不包括 end 本身的位置。 返回数组array 裁剪部分的新数组。

还有js本身Array的一些常用方法:

arrayObject.splice(index,howmany,[item1,.....,itemX])

index位置,可以和前边的_.indexOf混合使用,howmany长度,[ ]内为新添加的值,可选

arrayObject.shift()   和  arrayObject.unshift(newelement1,newelement2,....,newelementX)

shift删除并返回数组的第一个元素,unshift向数组的开头添加一个或多个元素,并返回长度

二、Collection的一些常用方法的总结:(包括Array Map Set)

_.forEach(collection,[iteratee=_.identity])

遍历集合中的每个元素, iteratee 调用3个参数: (value, index|key, collection)。 如果迭代函数(iteratee)显式的返回 false ,迭代会提前退出。

注意: 与其他"集合"方法一样,类似于数组,对象的 “length” 属性也会被遍历。想避免这种情况,对象可以用 _.forIn

_([1, 2]).forEach(function(value) {
 
  console.log(value);
 
});
 
// => Logs `1` then `2`.
 
_.forEach({ 'a': 1, 'b': 2 }, function(value, key) {
 
  console.log(key);
 
});
 
// => Logs 'a' then 'b' (iteration order is not guaranteed).
 

_.map(collection,[iteratee=_.identity])

迭代函数调用3个参数: (value, index|key, collection),返回值是一个数组,这是它和forIn和forEach的区别,map可以对单条数据进行操作返回,是比forIn和forEach更进一步的方法 

function square(n) {
  return n * n;
}
 
_.map([4, 8], square);
 
// => [16, 64]
 
 
 
_.map(['  foo  ', '  bar  '], _.trim);
 
// => ['foo', 'bar']
 

 

_.filter(collection,[predicate=_.identity])

 

返回真值。 predicate(断言函数)调用三个参数:(value, index|key, collection)var users = [
 
  { 'user': 'barney', 'age': 36, 'active': true },
 
  { 'user': 'fred',   'age': 40, 'active': false }
 
];
 
_.filter(users, function(o) { return !o.active; });
 
// => objects for ['fred']
 
 
 
_.filter(users, 'active');
 
// => objects for ['barney']
 

_.reject(collection,[predicate=_.identity])

 

返回非真值,是_filter的反向方法

var users = [
 
  { 'user': 'barney', 'age': 36, 'active': false },
 
  { 'user': 'fred',   'age': 40, 'active': true }
 
];
 
_.reject(users, function(o) { return !o.active; });
 
// => objects for ['fred']
 
 
 
_.reject(users, 'active');
 
// => objects for ['barney']
 
这里区分注意一下,_filter和_reject断言之后都是返回新数组,不改变老数组,而remove断言之后是改变老数组的,

.sortBy(collection,[iteratee=.identity])

创建一个元素数组。 以 iteratee 处理的结果升序排序。

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]]
 
_.includes(collection, value,[fromIndex=0])

检查 value(值) 是否在 collection(集合) 中。如果 collection(集合)是一个字符串,那么检查 value(值,子字符串) 是否在字符串中, 否则使用做等值比较。 如果指定 fromIndex 是负数,那么从 collection(集合) 的结尾开始检索。

_.includes([1, 2, 3], 1);
 
// => true
 
_.includes([1, 2, 3], 1, 2);
 
// => false
 
_.includes({ 'user': 'fred', 'age': 40 }, 'fred');
 
// => true
 
_.includes('pebbles', 'eb');
 
// => true

_.size(collection)

返回collection(集合)的长度,如果集合是类数组或字符串,返回其 length ;如果集合是对象,返回其可枚举属性的个数。

_.size([1, 2, 3]);

// => 3

_.size({ ‘a’: 1, ‘b’: 2 });

// => 2

_.size(‘pebbles’);

// => 7

三、Object的一些常用方法的总结:

_.forIn(object,[iteratee=_.identity])遍历函数会传入3个参数:(value, key, object)。forEach更多的用做集合,而forIn用做对象

function Foo() {
 
  this.a = 1;
 
  this.b = 2;
 
}
 
Foo.prototype.c = 3;
 
_.forIn(new Foo, function(value, key) {
 
  console.log(key);
 
});

// => Logs ‘a’, ‘b’, then ‘c’ (无法保证遍历的顺序)。


```javascript
_.assignIn(object,[sources])

合并对象

function Foo() {
 
  this.a = 1;
 
}
 
function Bar() {
 
  this.c = 3;
 
}
 
Foo.prototype.b = 2;
 
Bar.prototype.d = 4;
 
_.assignIn({ 'a': 0 }, new Foo, new Bar);


 
// => { 'a': 1, 'b': 2, 'c': 3, 'd': 4 }
 

_.get(object, path,[defaultValue]).   _.set(object,path,value)

 

var object = { 'a': [{ 'b': { 'c': 3 } }] };
 
_.get(object, 'a[0].b.c');
 
// => 3
 
 
 
var object = { 'a': [{ 'b': { 'c': 3 } }] };
 
_.set(object, 'a[0].b.c', 4);
 
console.log(object.a[0].b.c);
 
// => 4
 
 

_.values(object)

把object本身属性的值返回为数组

function Foo() {
 
  this.a = 1;
 
  this.b = 2;
 
}
 
Foo.prototype.c = 3;
 
_.values(new Foo);
 
// => [1, 2] (无法保证遍历的顺序)
 
_.values('hi');
 
// => ['h', 'i']
 

四、String的一些常用方法的总结:

_.trim

去空格,或者去固定符号,

_.trim('  abc  ');
 
// => 'abc'
 
_.trim('-_-abc-_-', '_-');
 
// => 'abc'
 
_.map(['  foo  ', '  bar  '], _.trim);
 
// => ['foo', 'bar']
 

五、Function的一些常用方法的总结:

 

_.once(func)

创建一个只能调用 func 一次的函数。 重复调用返回第一次调用的结果。 func 调用时, this 绑定到创建的函数,并传入对应参数。

var initialize = _.once(createApplication);
 
initialize();
 
initialize();
 
// `initialize` 只能调用 `createApplication` 一次。
 

_.delay(func,wait,[args])

延迟 wait 毫秒后调用 func。 调用时,任何附加的参数会传给func。

_.delay(function(text) {
 
  console.log(text);
 
}, 1000, 'later');
 
// => 一秒后输出 'later'。
 

 

 

六、Math的一些常用方法的总结:

 

```javascript
_.add(6, 4);
 
// => 10
_.subtract(6, 4);
 
// => 2
_.multiply(6, 4);
 
// => 24
_.divide(6, 4);
 
// => 1.5
_.min([4, 2, 8, 6]);
 
// => 2
 
_.min([]);
 
// => undefined
_.max([4, 2, 8, 6]);
 
// => 8
 
_.max([]);
 
// => undefined
_.sum([4, 2, 8, 6]);
 
// => 20
_.round(4.006);//四舍五入
 
// => 4
 

 

七、Number的一些常用方法的总结:

 

```javascript
_.random([lower=0],[upper=1],[floating])

产生一个包括 lower 与 upper 之间的数。 如果只提供一个参数返回一个0到提供数之间的数。 如果 floating 设为 true,或者 lower 或 upper 是浮点数,结果返回浮点数。 

_.random(0, 5);
 
// => an integer between 0 and 5
 
_.random(5);
 
// => also an integer between 0 and 5
 
_.random(5, true);
 
// => a floating-point number between 0 and 5
 
_.random(1.2, 5.2);
 
// => a floating-point number between 1.2 and 5.2
 

 

八、Date的一些常用方法的总结:

_

.now()

获得 Unix 纪元 (1 January 1970 00:00:00 UTC) 直到现在的毫秒数。
 
_.defer(function(stamp) {
  console.log(_.now() - stamp);
}, _.now());
 
// => 记录延迟函数调用的毫秒数
 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值