ES6小技巧之代替lodash


Posted in Javascript onJune 07, 2019

Javascript ES6标准实行后,Lodash或者Ramada中的一些功能我们就不需要了,可以使用ES6的语法来实现

获取Object中指定键值

我们现在可以使用解包的方法快速获取对象中指定键值的值

const obj = {
 a:1,
 b:2,
 c:3,
 d:4
};

// 获取obj中a与b的值
const {a,b} = obj;

// 也可以给他们取别名
const {a:A, b:B} = obj;

这个小技巧非常的方便,也是最基础的使用方法

排除Object中不需要的键值

既然我们可以获取到想要的对象键值,那么也可以排除掉不想要的键值,使用方法就要用到ES6的rest新特性

const obj = {
 a:1,
 b:2,
 c:3,
 d:4
}

// 我们想要获取除了a之外的所有属性
const {a, ...other} = obj

我们只要指定那些排除掉的属性,剩下的就是需要的属性,这样可以非常快速的排除不需要的属性

对象快速求和

有时候我们需要对一组对象数组中的某一个属性求总和,以前我们可以使用forEach或者for这样的循环遍历的方法来计算,现在我们可以使用reduce方法来快速实现

const objs = [
{name:'lilei', score: 98},
{name:'hanmeimei', score: 95},
{name:'polo', score: 85},
...
]

const scoreTotal = objs.reduce( (total, obj) => {
 return obj.score + total;
}, 0 /*第二个参数是total的初始值*/)

使用reduce就能快速的实现对某一个属性的总和计算

map也能异步遍历

是不是觉得只有for能够进行异步操作不方便,其实map也能进行异步操作,不过需要结合Promise的新方法一起使用

const arr = [1,2,3,4,...]

const queue = arr.map(async item => {
 return item + 1;
})

Promise.all(queue).then(newArr => console.log(newArr))

这样一来我们在map中也能使用异步操作了

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
javascript 鼠标拖动图标技术
Feb 07 Javascript
jQuery 版元素拖拽原型代码
Apr 25 Javascript
JavaScript定义类和对象的方法
Nov 26 Javascript
在JavaScript的正则表达式中使用exec()方法
Jun 16 Javascript
Three.js学习之正交投影照相机
Aug 01 Javascript
jQuery插件扩展操作入门示例
Jan 16 Javascript
微信小程序之MaterialDesign--input组件详解
Feb 15 Javascript
js实现五星评价功能
Mar 08 Javascript
Express URL跳转(重定向)的实现方法
Apr 07 Javascript
JS闭包原理与应用经典示例
Dec 20 Javascript
layui table 表格上添加日期控件的两种方法
Sep 28 Javascript
微信小程序实现滚动加载更多的代码
Dec 06 Javascript
vue+element 模态框表格形式的可编辑表单实现
Jun 07 #Javascript
vue-cli3项目展示本地Markdown文件的方法
Jun 07 #Javascript
Element实现表格分页数据选择+全选所有完善批量操作
Jun 07 #Javascript
详解vue项目中实现图片裁剪功能
Jun 07 #Javascript
sortable+element 实现表格行拖拽的方法示例
Jun 07 #Javascript
利用Vue-draggable组件实现Vue项目中表格内容的拖拽排序
Jun 07 #Javascript
Vue中实现权限控制的方法示例
Jun 07 #Javascript
You might like
如何在PHP中使用Oracle数据库(5)
2006/10/09 PHP
如何开发一个虚拟域名系统
2006/10/09 PHP
zend optimizer在wamp的基础上安装图文教程
2013/10/26 PHP
ThinkPHP自动填充实现无限级分类的方法
2014/08/22 PHP
php中的字符编码转换函数用法示例
2014/10/20 PHP
php基于str_pad实现卡号不足位数自动补0的方法
2014/11/12 PHP
PHP集成百度Ueditor 1.4.3
2014/11/23 PHP
php实现产品加入购物车功能(1)
2020/07/23 PHP
PHP微信支付结果通知与回调策略分析
2019/01/10 PHP
js移除事件 js绑定事件实例应用
2012/11/28 Javascript
jquery 触发a链接点击事件解决方案
2013/05/02 Javascript
javascript检查浏览器是否已经启用XX功能
2015/07/10 Javascript
JS实现Fisheye效果动感放大菜单代码
2015/10/21 Javascript
jquery的checkbox,radio,select等方法小结
2016/08/30 Javascript
BootStrap 可编辑表Table格
2016/11/24 Javascript
移动端点击态处理的三种实现方式
2017/01/12 Javascript
使用vue.js2.0 + ElementUI开发后台管理系统详细教程(二)
2017/01/21 Javascript
基于react后端渲染模板引擎noox发布使用
2018/01/11 Javascript
jquery应用实例分享_实现手风琴特效
2018/02/01 jQuery
React styled-components设置组件属性的方法
2018/08/07 Javascript
jQuery实现购物车的总价计算和总价传值功能
2018/11/28 jQuery
微信小程序性能优化之checkSession的使用
2019/03/06 Javascript
Vuex的各个模块封装的实现
2020/06/05 Javascript
python 自动化将markdown文件转成html文件的方法
2016/09/23 Python
Django模板导入母版继承和自定义返回Html片段过程解析
2019/09/18 Python
Selenium alert 弹窗处理的示例代码
2020/08/06 Python
如何以Winsows Service方式运行JupyterLab
2020/08/30 Python
CSS3制作炫酷的自定义发光文字
2016/03/28 HTML / CSS
优秀士兵个人事迹材料
2014/01/19 职场文书
会计电算化学生个人的自我评价
2014/02/08 职场文书
巾帼文明岗汇报材料
2014/12/24 职场文书
怎样写辞职信
2015/02/27 职场文书
2015年妇幼卫生工作总结
2015/05/23 职场文书
学习十八大的感悟
2015/08/11 职场文书
2016年母亲节广告语
2016/01/28 职场文书
教你使用vscode 搭建react-native开发环境
2021/07/07 Javascript