总结分享10 个超棒的 JavaScript 简写技巧

目录
  • 1.合并数组
  • 2.合并数组（在开头位置）
  • 3.克隆数组
  • 4.解构赋值
  • 5.模板字面量
  • 6.For循环
  • 7.箭头函数
  • 8.在数组中查找对象
  • 9.将字符串转换为整数
  • 10.短路求值
  • 补充几点
  • 编码习惯

1.合并数组

普通写法：

我们通常使用Array中的concat()方法合并两个数组。用concat()方法来合并两个或多个数组，不会更改现有的数组，而是返回一个新的数组。请

看一个简单的例子：

let apples = ['', ''];
let fruits = ['', '', ''].concat(apples);
console.log( fruits );
//=> ["", "", "", "", ""]

简写写法：

我们可以通过使用ES6扩展运算符(...)来减少代码，如下所示：

let apples = ['', ''];
let fruits = ['', '', '', ...apples];  // <-- here
console.log( fruits );
//=> ["", "", "", "", ""]

2.合并数组（在开头位置）

普通写法： 假设我们想将apples数组中的所有项添加到Fruits数组的开头，而不是像上一个示例中那样放在末尾。我们可以使用Array.prototype.unshift()来做到这一点：

let apples = ['', ''];
let fruits = ['
赞 (0)

相关推荐

  • JavaScript中最常用的10种代码简写技巧总结

    JavaScript中最常用的10种代码简写技巧总结

    前言 本文主要给大家整理了一份10个程序员常用的代码简写技术,看懂一种是入门,全懂就是大神,你能知道几个呢?下面话不多说了,来看看详细的介绍: 一.三元操作符 当想写if-else语句时,使用三元操作符来代替. const x = 20;let answer;if (x > 10) { 简写: const answer = x > 10 ? 'is greater' : 'is lesser'; 也可以嵌套if语句: const big = x > 10 ? " greater

  • 20个JS简写技巧提升工作效率

    目录 当同时声明多个变量时,可简写成一行 利用解构,可为多个变量同时赋值 巧用三元运算符简化if else 使用||运算符给变量指定默认值 使用&&运算符简化if语句 使用解构交换两个变量的值 适用箭头函数简化函数 使用字符串模板简化代码 多行字符串也可使用字符串模板简化 对于多值匹配,可将所有值放在数组中,通过数组方法来简写 巧用ES6对象的简洁语法 使用一元运算符简化字符串转数字 使用repeat()方法简化重复一个字符串 使用双星号代替Math.pow() 使用双波浪线运算符(~~)

  • JavaScript简写技巧

    目录 1. 合并数组 2. 合并数组(在开头位置) 3. 克隆数组 4. 解构赋值 5. 模板字面量 6. For循环 7. 箭头函数 8. 在数组中查找对象 9. 将字符串转换为整数 10. 短路求值 补充几点 箭头函数 在数组中查找对象 短路求值替代方案 1. 合并数组 普通写法: 我们通常使用Array中的concat()方法合并两个数组.用concat()方法来合并两个或多个数组,不会更改现有的数组,而是返回一个新的数组.请看一个简单的例子: let apples = ['

  • JavaScript ES6中的简写语法总结与使用技巧

    ES6为一些已有的功能提供了非破坏性更新,这类更新中的大部分我们可以理解为语法糖,称之为语法糖,意味着,这类新语法能做的事情其实用ES5也可以做,只是会稍微复杂一些.本章我们将着重讨论这些语法糖,看完之后,可能你会对一些你很熟悉的ES6新语法有不一样的理解. JavaScript ES6对象字面量 对象字面量是指以{}形式直接表示的对象,比如下面这样: var book = { title: 'Modular ES6', author: 'Nicolas', publisher: 'O´Reil

  • javascript简写常用的12个技巧（可以大大减少你的js代码量）

    前言 本文主要给大家分享了javascript简写常用的12个技巧,无论你是初学者还是资深人士,都值得一读!下面话不多说了,来一起看看详细的介绍: 1. 空(null, undefined)验证 当我们创建了一个新的变量,我们通常会去验证该变量的值是否为空(null)或者未定义(undefined).这对于JavaScript编程来说,是一个经常要考虑到的验证. 如果直接写,像下面这样: if (variable1 !== null || variable1 !== undefined || v

  • 史上最全JavaScript常用的简写技巧（推荐）

    JavaScript 是属于网络的脚本语言!被数百万计的网页用来改进设计.验证表单.检测浏览器.创建cookies,以及更多的应用.同时很容易使用,所以越来越多的开发者选择js代码来实现自己想要的效果,但开发过程中,为了更高的效率和良好的代码规范要求,我们不得不知晓js一些常用的简写技巧,如下我帮大家整理了下,一起进来看看吧~ 1. 三元运算符 当你想用一行代码来写if...else语句的时候,使用三元操作符是非常好的选择,例如: const x = 20; let answer; if (x

  • 总结分享10 个超棒的 JavaScript 简写技巧

    目录 1.合并数组 2.合并数组(在开头位置) 3.克隆数组 4.解构赋值 5.模板字面量 6.For循环 7.箭头函数 8.在数组中查找对象 9.将字符串转换为整数 10.短路求值 补充几点 编码习惯 1.合并数组 普通写法: 我们通常使用Array中的concat()方法合并两个数组.用concat()方法来合并两个或多个数组,不会更改现有的数组,而是返回一个新的数组.请 看一个简单的例子: let apples = ['', '']; let fruits = ['', '', ''].c

  • 分享10提高 Python 代码的可读性的技巧

    目录 1.字符串反转 2.首字母大写 3.查询唯一元素 4.变量交换 5.列表排序 6.列表推导式 7.合并字符串 8.拆分字符串 9.回文串检测 10.统计列表元素出现次数 1. 字符串反转 字符串反转有很多方法,咱们再这里介绍两种:一种是切片,一种是python字符串的reversed方法. # -!- coding: utf-8 -!- string = 'hello world' # 方法1 new_str = string[::-1] ic(new_str) # 方法二 new_str

  • 分享12个非常实用的JavaScript小技巧

    分享12个非常实用的JavaScript小技巧

    在这篇文章中将给大家分享12个有关于JavaScript的小技巧.这些小技巧可能在你的实际工作中或许能帮助你解决一些问题. 使用!!操作符转换布尔值 有时候我们需要对一个变量查检其是否存在或者检查值是否有一个有效值,如果存在就返回true值.为了做这样的验证,我们可以使用!!操作符来实现是非常的方便与简单.对于变量可以使用!!variable做检测,只要变量的值为:0.null." ".undefined或者NaN都将返回的是false,反之返回的是true.比如下面的示例: func

  • 推荐10个超棒的jQuery工具提示插件

    推荐10个超棒的jQuery工具提示插件

    1. Pop! 使用 Pop!可以创建简单的下拉菜单!这是一个并不引人注目的 jQuery 插件. 2. BetterTip 允许你创建定制的 Tool tips 的 jQuery 插件. 3. EZPZ Tooltip 非常简单的使用边框的 tooltip,同样也可以跟随鼠标. 4. BsTip 各种简单的 tooltips,使用淡入和淡出效果,并且也有边框环绕. 5. clueTip 当鼠标悬浮的时候允许显示一个漂亮的 tooltip 在指定的元素上. 6. inline HTML tool

  • 超棒的javascript页面顶部卷动广告效果

    超棒的javascript页面顶部卷动广告效果

    0) { callreduceheight(); if (typeof(handobj)=="number") { clearTimeout(handobj); } } } function addheight() { nowheight+=speed; if (nowheight>maxheight) { clearInterval(addfunc); closdiv.style.top=maxheight-30; closdiv.style.display="blo

  • 分享10个很棒的学习Android开发的网站

    分享10个很棒的学习Android开发的网站

    我推荐的网站,都是我在学习Android 开发过程中发现的好网站,给初学者一些建议,少走一些弯路. Android Developers 作为一个Android 开发者,官网的资料当然不可错过,从设计,培训,指南,文档,都不应该错过,在以后的学习过程中慢慢理解体会. Android Developer Android Guides - CodePath CodePath 是国外一个技术培训机构,主要培训iOS 和Android 开发,而CodePath 将Android Guides 放在Git

  • 分享10个优化代码的CSS和JavaScript工具

    分享10个优化代码的CSS和JavaScript工具

    检查和测试代码来发现任何潜在错误,从而在放到网站上之前及时消除错误是一个非常重要的过程.代码检查的过程也俗称为是Web设计师 和开发者之间的linting.作为一个设计师,如果你想要写出高度优化的代码,那么你一定需要linting工具.有两种类型的代码检查工具.一种是在 执行时间检查代码中的错误和bug.另一种是使用静态代码分析技术并在执行前检查码.后者因为可以节省时间和麻烦显然更佳. 事实上,linting可以放在不同的阶段.如果你喜欢在敲代码的时候测试代码,那么你可以使用lint工具.当然,

  • 总结分享10个JavaScript代码优化小tips

    总结分享10个JavaScript代码优化小tips

    目录 写在前面 慎用全局变量 通过原型新增方法 避免闭包中的内存泄露 避免使用属性访问方法 for循环优化 选择最优的循环方式 减少判断层级 减少作用域链查找层级 减少数据读取次数 字面量与构造式 写在前面 想要做到JavaScript的代码优化,首先需要做的是准确的测试JavaScript的代码执行时间.其实需要做的就是采集大量的执行样本进行数学统计和分析,这里我们使用的是benchmark.js来检测代码的执行情况. 首先我们需要在项目中安装依赖,代码如下: yarn add benchma

  • 分享10个常见的JavaScript前端手写功能

    目录 1.防抖 2.节流 3.深拷贝 4.手写 Promise 5.异步控制并发数 6.继承 7.数组排序 8.数组去重 9.获取 url 参数 10.事件总线 | 发布订阅模式 1.防抖 function debounce(fn, delay) {   let timer   return function (...args) {     if (timer) {       clearTimeout(timer)     }     timer = setTimeout(() => {  

随机推荐