当前位置:首页 > 技术分析 > 正文内容

ES6 新增了哪些新特性 (二)(es6新增了哪些东西)

ruisui883个月前 (02-03)技术分析15

关于 ES6规范及新特性

对象字面量申明增强

ES6 之前,申明对象字面量方式其实就是直接定义一个json对象.存在的仅仅是对象的属性和值.

ES6 之后,对象字面量被扩展支持直接设置原型,简洁属性赋值和方法,超类调用,这也让对象字面量和类声明的关系更密切,并让基于对象的设计更便利

ES6之前:

var obj = {

__proto__: theProtoObj,

// 下面的写法不会设置内部原型

'__proto__': theProtoObj,

// 方法

toString() {

// 调用父对象的方法

return "d " + super.toString();

},

// 属性名是一个表达式

[ "prop_" + (() => 42)() ]: 42

};

proto: theProtoObjproto属性需要原生支持,这一属性在ECMAScript前一个版本中一度被废弃,目前 ES6 再度使用起来.

'proto': theProtoObj上面这种设置内部原型的方法不会被支持, proto 并不是一个字符串,所以这种字符串设置方式不会被支持.

对象字面量支持方法调用:toString(){//调用父级对象的方法return "d " + super.toString();}

//属性名支持表达式[ “prop_” + (() => 42)() ]

模版字符串

允许对字符串构建的定制化,避免注入攻击或其他需求

// 普通字符串

`This is a string.`

// 多行字符串

`This is

a string.`

// 字符串中嵌入变量

var name = "world", time = "today";

`Hello ${name}, how are you ${time}?`

// 模版标签

String.raw`In ES5 "\n" is a line-feed.`

// 下面构造一个HTTP请求头,来解释差值替换和构造

GET`http://foo.org/bar?a=${a}&b=${b}

Content-Type: application/json

X-Credentials: ${credentials}

{ "foo": ${foo},

"bar": ${bar}}`(myOnReadyStateChangeHandler);

函数默认参数

ES6 终于支持参数默认值了

function f(x, y=12) {

// 如果不传递y或传递undefined,y的值为12

return x + y;

}

f(3) == 15

Let

它的功能是定义变量,当时和 var 有很大区别.let 定义的变量只有在它所在的代码块内有效.它解决了一个问题,javascript 存在很大的缺陷就是没有作用域,所以定义的变量互相覆盖.

Let 的出现成功解决了这个问题.

function test() {

{

let m{

m=100;

}

// let变量可以再次赋值

m=200;

// 在块作用域中重复声明将会报错,如下

let x = 300;

}

}

Const

const也用来声明变量的关键字,但是它声明的是常量.在 let 代码块中不能使用 Const 申明常量

如下代码是不允许的:

function test() {

{

let x;

{

// 块作用域

const x = "test"; //不允许这样代码块中的常量定义

}

}

}

支持换行

如果没有模板字符串,对于一个长字符串,你大概要写成这样的:

var sql =

"SELECT * FROM Users " +

"WHERE FirstName='Mike' " +

"LIMIT 5;"

当然也可以这样通过数组的形式实现:

var sql = [

"SELECT * FROM Users",

"WHERE FirstName='Mike'",

"LIMIT 5;"

].join(' ')

现在 ES6 支持这样的方式实现换行:

let sql = `

SELECT * FROM Users

WHERE FirstName='Mike'

LIMIT 5;

`

出自:一介布衣博客

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/695.html

分享给朋友:

“ES6 新增了哪些新特性 (二)(es6新增了哪些东西)” 的相关文章

gitlab 分支保护设置

一、功能描述代码管理中管理,我们把稳定的分支设置为保护,可以防止其他人员误操作(例如删除,合并,推送代码等)。二、Gitlab配置步骤1 点击项目Repository标签2.点击Expand标签3.配置如下:默认master是被保护的,而且只有维护人员具有推送和合并权限。设置保护分支,这里的beta...

迁移GIT仓库并带有历史提交记录

迁移git仓库开发在很多时候,会遇到一个问题。GIT仓库的管理,特别是仓库的迁移。我需要保留已有的历史记录,而不是重新开发,重头再来。我们可以这样做:使用--mirror模式会把本地的分支都克隆。// 先用--bare克隆裸仓库 git clone git@gitee.com:xxx/testApp...

别让“跑焦”毁所有!仅需这一项设置,即可显著改善镜头对焦精度

我常常会收到一些摄影爱好者的私信,也一直在努力的帮助大家解决更多摄影中常见问题。在我收到的所有问题中。有一个问题是最麻烦的,那就是“为什么我的图像看起来模糊?”。这个问题几乎每个人都遇到过,究其原因可以说是多种多样相对复杂。起初我一直认为是对焦问题所导致,也就有了我之前所写的“后按对焦”以及“对焦模...

一起学Vue:路由(vue-router)

前言学习vue-router就要先了解路由是什么?前端路由的实现原理?vue-router如何使用?等等这些问题,就是本篇要探讨的主要问题。vue-router是什么路由是什么?大概有两种说法:从路由的用途上来解释路由就是指随着浏览器地址栏的变化,展示给用户的页面也不相同。从路由的实现原理上来解释路...

vue打开新窗口并且实现传参,有图有真相

我要实现的功能是打开一个新窗口用来展示新页面,而且需要传参数,并且参数不能显示在地址栏里面,而且当我刷新页面的时候,传过来的参数不能丢失,要一直存在,除非我手动关闭这个新窗口,即浏览器的标签页。通过面向百度编程,发现网上的根本达不到这个效果,而且还都是坑,明明实现不了,还若有其事的写出来,于是我在标...

分享15个基于Vue3.0全家桶的优秀开源项目

大家好,我是 Echa。今天来分享 15 个基于 Vue3.0 全家桶的优秀开源项目!1. Vue Admin Bettergithub : https://github.com/chuzhixin/vue-admin-bettervue admin better 对比其他来源 admin 框架有如...