JavaScript 实用技巧
1数组中删除重复
let arr = [1,2,4,3,6,4] Array.from(new Set(arr)) // es6中 .from()[1,2,4,3,6] [...new Set(arr)] // 扩展运算符[1,2,4,3,6]
2替换数组中指定的值
arr .splice(1,3,7,8,9) // [7, 8, 9]
arr // [1, 7, 8, 9, 6, 4]
3数组映射
let mapValue = [
{ name: '山东', value: 22 },
{ name: '北京', value: 23 },
{ name: '上海', value: 24 }
] mapValue.map(item=> {item.name}); // map Array.from(mapValue, ({name}) => name); // .from()
4清空数组
arr.length = 0 // arr =[]
5将数组转化为对象
let obj = {...arr } // {0: 1, 1: 7, 2: 8, 3: 9, 4: 6, 5: 4}
6合并数组
let arr2 =['one','two',2] // [1, 2, 4, 3, 6, 4, "one", "two"] [...arr2,...arr] // ["one", "two", 1, 2, 4, 3, 6, 4]
7两个数组的交集
首先保证数组中的值不重复,然后利用.filter和.includes方法即可
let numOne = [0, 2, 4, 6, 8, 8];
let numTwo = [1, 2, 3, 4, 5, 6]; [...new Set(numOne)].filter(item => numTwo.includes(item))
8从数组中删除假值
首先在Javascript中,假值包括false、0、''、null、NaN、undefined
let mixArrs =[null,3,undefined,true,''] mixArrs.filter(Boolean); // [3, true]
9颠倒数组中元素的顺序
let mixArrs =[null,3,undefined,true,''] mixArrs.reverse() // ["", true, undefined, 3, null]
10数组中的所有值求和
let array = [1, 2, 3, 4, 5]
eval(array.join("+")) ; //
array.reduce((x, y) => x + y); //
11使用固定值填充数组
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.fill("Runoob"); //Runoob,Runoob,Runoob,Runoob
let newArr = new Array(6).fill('2'); // ["2", "2", "2", "2", "2", "2"]
JavaScript 实用技巧的更多相关文章
- javascript实用技巧、javascript高级技巧
字号+作者:H5之家 来源:H5之家 2016-10-31 11:00 我要评论( ) 三零网提供网络编程. JavaScript 的技术文章javascript实用技巧.javascript高级技巧 ...
- 【JavaScript实用技巧(二)】Js操作DOM(由问题引发的文章改版,新人大佬都可)
[JavaScript实用技巧(二)]Js操作DOM(由问题引发的文章改版,新人大佬都可!) 博客说明 文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人 ...
- JavaScript 实用技巧和写法建议
1.前言 从大学到现在,接触前端已经有几年了,感想方面,就是对于程序员而言,想要提高自己的技术水平和编写易于阅读和维护的代码,我觉得不能每天都是平庸的写代码,更要去推敲,去摸索和优化代码,总结当中的技 ...
- javascript实用技巧,js小知识
一.js整数的操作 使用|0和~~可以将浮点转成整型且效率方面要比同类的parseInt,Math.round 要快,在处理像素及动画位移等效果的时候会很有用.性能比较见此. var foo = (1 ...
- JavaScript实用技巧总结
前言 总结一下最近接触到的JavaScript语法糖,与大家共享. 每块糖都有详细的说明和示例,就不多说了. 准确的类型检查 /* * @function: * 类型检查示例 * 通过此方法,可以检查 ...
- Javascript实用技巧
1. 给参数赋默认值 //通常写法 function dateRender(format){ if(format){ format = 'Y-m-d'; } // code } //强推 functi ...
- 41个Web开发者必须收藏的JavaScript实用技巧
1. 将彻底屏蔽鼠标右键 oncontextmenu=”window.event.returnValue=false” < table border oncontextmenu=return(f ...
- 12个十分实用的JavaScript小技巧
12个非常实用的JavaScript小技巧 在这篇文章中将给大家分享12个有关于JavaScript的小技巧.这些小技巧可能在你的实际工作中或许能帮助你解决一些问题. 使用!!操作符转换布尔值 有时候 ...
- 实用Javascript调试技巧
摘要: 高效调试JS代码. 原文:实用Javascript调试技巧分享 作者:MudOnTire Fundebug经授权转载,版权归原作者所有. 见过太多同学调试Javascript只会用简单的con ...
随机推荐
- 53 (OC) 皮肤切换
1:添加皮肤 1.1:iOS皮肤切换方案 http://www.cocoachina.com/ios/20171012/20762.html 1.2:整合 iOS几种换肤思路和demo https:/ ...
- 大白话讲解 Java程序的运行机制和JVM
据我们所知,Java程序是跨平台的.那么Java是如何实现跨平台的呢?看完下面几句话就会恍然大悟! 1.为什么Java语言既是编译型语言又是解释型语言呢? 答:运行Java程序,首先需要经过编译,编译 ...
- [Spark] 05 - Spark SQL
关于Spark SQL,首先会想到一个问题:Apache Hive vs Apache Spark SQL – 13 Amazing Differences Hive has been known t ...
- rocketmq学习(二) rocketmq集群部署与图形化控制台安装
1.rocketmq图形化控制台安装 虽然rocketmq为用户提供了使用命令行管理主题.消费组以及broker配置的功能,但对于不够熟练的非运维人员来说,命令行的管理界面还是较难使用的.为此,我们可 ...
- SpringMVC 图片上传虚拟目录
可以直接在tomcat的server.xml文件中进行设置,位置在Host中 添加内容为:<Context docBase="G:\JAVAtest\temp" path=& ...
- .net core 使用Rotativa创建PDF文档
一.下载Rotaiva 工具 = > NuGet包管理器 = > 管理解决方案的NuGet程序包 在打开的页面中搜索 Rotativa.AspNetCore 如下图: 选中红框的记 ...
- 给定一个公式字符串用java进行拆解并计算结果
需求很简单,给定一个字符串形式的公式规则,用java代码进行拆解,并能计算出结果. ♦考虑字符串中数字格式[整数.小数点] ♦考虑字符串中运算符[+-*/()] ♦考虑空格.运算规则[被0除] 以下是 ...
- MongoDB的可视化工具(Studio 3T)
前面我们已经介绍了MongoDB怎么安装,接下来要安装他的可视化工具——Studio 3T. 先到这下载一个压缩包,百度网盘,https://pan.baidu.com/s/1M8mlWo334 ...
- Terminal MultipleXer---终端复用器tmux基本使用
Terminal MultipleXer---终端复用器tmux 使用场景:1.scp大文件 2:编译大文件 3:多窗口对比文件 1.安装tmux [root@localhost ~]# yum in ...
- 使用gtest(googletest)进行c++单元测试
这是系列文章的第三篇,前两篇https://www.cnblogs.com/gaopang/p/11243367.html和https://www.cnblogs.com/gaopang/p/1158 ...