let myKey = 'variableKey';
let obj = {
key1: 'One',
key2: 'Two',
[myKey]: 'Three' /* 棒呆! */
};

给变量键加上一层 [],程序员们就可以在一条对象字面量声明里完成全部事情。


let ages = [12, 19, 6, 4];

let firstAdult = ages.find(age => age >= 18); //
let firstAdultIndex = ages.findIndex(age => age >= 18); //

find 和 findIndex 允许基于计算值查找,这种方式还防止了一些不必要的副作用和循环产生的不确定值。


// 传参给需要多个独立参数的函数 arguments
// 很像 Function.prototype.apply()
let numbers = [9, 4, 7, 1];
Math.min(...numbers); // // 将节点列表转换成数组
let divsArray = [...document.querySelectorAll('div')]; // 将参数转换成数组
let argsArray = [...arguments];

这个神奇的运算符还有附加的好处:它能把可迭代对象(NodeListarguments 等等)转化为真正的数组,而之前我们只能用 Array.from 或其它的 hack 方法。



// 多行字符串
let myString = `Hello I'm a new line`; // 这么写完全没问题! // 基础的插值操作
let obj = { x: 1, y: 2 };
console.log(`Your total is: ${obj.x + obj.y}`); // Your total is: 3

当然,除了多行字符串,模板字符串还有其它的能力,比如说简单或者高级的插值。不过,仅仅是优雅的写多行字符串这件事情,已经让我十分欣慰了。



// 基础用法
function greet(name = 'Anon') {
console.log(`Hello ${name}!`);
}
greet(); // Hello Anon! // 还可以是函数!
function greet(name = 'Anon', callback = function(){}) {
console.log(`Hello ${name}!`); // 不再需要“callback && callback()”啦 (不需要条件判断)
callback();
} // 只给其中一个参数默认值
function greet(name, callback = function(){}) {}

如果在调用的时候不传无默认值的参数,其它的语言可能会发出警告,但是 JavaScript 会默认将它们设为 undefined

ES6的一些基本用法

es6小技巧的更多相关文章

  1. 6个讨喜的 ES6 小技巧

    [编者按]本文作者为 Axel Rauschmayer,主要介绍6个 ES6 小技巧.文章系国内 ITOM 管理平台 OneAPM 编译呈现. 在本文中,笔者将介绍6个由 ES6 新功能带来的小技巧. ...

  2. 【js】中的小技巧

    本文主要介绍一些JS中用到的小技巧 1. 类型强制转换   1.1 string强制转换为数字 可以用*1来转化为数字(实际上是调用.valueOf方法) 然后使用Number.isNaN来判断是否为 ...

  3. ES6中常用的小技巧,用了事半功倍哦

    ES6中常用的小技巧,如果能在实际项目中能使用到,必定事半功倍: 1. 强制要求参数 ES6提供了默认参数值机制,允许你为参数设置默认值,防止在函数被调用时没有传入这些参数. 在下面的例子中,我们写了 ...

  4. 12个非常实用的JavaScript小技巧

    在这篇文章中将给大家分享12个有关于JavaScript的小技巧.这些小技巧可能在你的实际工作中或许能帮助你解决一些问题. 使用!!操作符转换布尔值 有时候我们需要对一个变量查检其是否存在或者检查值是 ...

  5. ( 译、持续更新 ) JavaScript 上分小技巧(四)

    后续如有内容,本篇将会照常更新并排满15个知识点,以下是其他几篇译文的地址: 第一篇地址:( 译.持续更新 ) JavaScript 上分小技巧(一) 第二篇地址:( 译.持续更新 ) JavaScr ...

  6. ( 译、持续更新 ) JavaScript 上分小技巧(三)

    最近家里杂事较多,自学时间实在少的可怜,所以都在空闲时间看看老外写的内容,学习之外顺便翻译分享~等学习的时间充足些再写写自己的一些学习内容和知识点分析(最近有在接触的:复习(C#,SQL).(学习)T ...

  7. ( 译、持续更新 ) JavaScript 上分小技巧(二)

    考虑到文章过长,不便于阅读,这里分出第二篇,如有后续,每15个知识点分为一篇... 第一篇地址:( 译.持续更新 ) JavaScript 上分小技巧(一) 第三篇地址:( 译.持续更新 ) Java ...

  8. ( 译、持续更新 ) JavaScript 上分小技巧(一)

    感谢好友破狼提供的这篇好文章,也感谢写这些知识点的作者们和将他们整理到一起的作者.这是github上的一篇文章,在这里本兽也就只做翻译,由于本兽英语水平和编程能力都不咋地,如有不好的地方也请多理解体谅 ...

  9. 12个非常有用的JavaScript小技巧

    在这篇文章中将给大家分享12个有关于JavaScript的小技巧.这些小技巧可能在你的实际工作中或许能帮助你解决一些问题. 使用!!操作符转换布尔值 有时候我们需要对一个变量查检其是否存在或者检查值是 ...

随机推荐

  1. 十三、C# 事件

    1.多播委托 2.事件 3.自定义事件   在上一章中,所有委托都只支持单一回调. 然而,一个委托变量可以引用一系列委托,在这一系列委托中,每个委托都顺序指向一个后续的委托, 从而形成了一个委托链,或 ...

  2. Visual Studio vs2010 去掉中文注释红色下划线;去掉代码红色下划线;

    vs去掉下挂线也分两种: 1.去掉中文注释红色下划线,需要去掉VisualAssist下划线鸡肋功能: 1.选择Visual AssistX Options: 2.把如图所示的勾去掉,解决. 以后再次 ...

  3. SGU 224.Little Queens

    时间限制:0.75s 空间限制:6M 题意 n*n(n<=10)的棋盘,求出放置m(m<=n*n)个皇后的方案数. Solution: 状态压缩+位运算  搜索. 首先我们从上往下逐行放置 ...

  4. 24种设计模式--工厂方法模式【Factory Method Pattern】

    女娲补天的故事大家都听说过吧,今天不说这个,说女娲创造人的故事,可不是“造人”的工作,这个词被现代人滥用了. 这个故事是说,女娲在补了天后,下到凡间一看,哇塞,风景太优美了,天空是湛蓝的,水是清澈的, ...

  5. 基于jQuery选择器的整理集合

    jquery对象访问1.each(callback):以每个匹配的元素作为上下文来执行一个函数,return false;停止循环;return true;跳至下一个循环. 来个实例 : 代码如下: ...

  6. 在php中使用Memcache

    在上一篇博客中我写到了memcache的安装和管理,在这一篇博客中我将写到的是在php中如何使用memcache. 一.安装memcache扩展 首先我们通过phpinfo()函数查看一下我们当前的p ...

  7. 不让input表单的输入框保存用户输入的历史记录

    如何不让input表单的输入框保存用户输入的历史记录.  有时我们在设计网页时不想让表单保存用户输入历史记录,比如一些隐私数据,或一些冲值卡 <input name="test&quo ...

  8. Webservices-1.web服务定义简介

    一.WEB服务定义(摘自维基百科)详情:http://zh.wikipedia.org/wiki/Web%E6%9C%8D%E5%8A%A1 Web服务是一种服务导向架构的技术,通过标准的Web协议提 ...

  9. 实战EntityFramework

    删除对象一定要在同一个context 我尝试这在两个方法中使用两个context(Container)实例来进行一个获得一个删除,结果我获得的”The object cannot be deleted ...

  10. BZOJ 3240 矩阵游戏

    Description 婷婷是个喜欢矩阵的小朋友,有一天她想用电脑生成一个巨大的\(n\)行\(m\)列的矩阵(你不用担心她如何存储).她生成的这个矩阵满足一个神奇的性质:若用\(F[i][j]\)来 ...