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

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

zonemu3个月前 (07-23)技术文章35

关于 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;

`

出自:一介布衣博客

相关文章

Vue3 如何实现父子组件传值?(vue父子组件传值props)

在Vue 3中,要实现父子组件传值效果主要通过props和emit两种机制来实现,下面我们就来详细介绍一下这两种机制。父组件向子组件传值propsprops是Vue组件的一种机制,主要的作用就是实现从...

面试官:聊聊你知道的Vue与React的区别

最近面到很多大公司的时候,小编都会碰到一个很尴尬的问题,很多大公司的技术栈都是React,但是小编学的是Vue,其实从本质上来说两者都是比较优秀的前端框架,所以有些面试官会问到Vue和React的区别...

Web前端全套教程+视频包含JavaScript、Vue等

写在前面:web前端从入门到精通经典教程,老师精心讲,想从事编程或者数据分析行业的小伙伴点进来,只需你评论并关注私信留言“前端”。便可免费获取。WEB前端简介:WEB前端工程师,也叫Web前端开发工程...

web前端是什么,在哪些地方有应用,html和html5区别都在这里了

web前端是什么,在哪些地方有应用简介web前端开发技术什么是html、html5什么是css、css3什么是js,javascriptweb前端的应用大家好,我是ots_luo,很多小伙伴不知道we...

HTML5培训学习(简单明了)(html5教学视频教程)

这些事HTML5培训认为在学习HTML5前应该做好的准备,欢迎参考指正:为什么学习HTML5?软硬件环境介绍HTML5环境搭建常见问题解决掌握技能需求为什么学习HTML5?1:自从2010年HTML5...

最快清除数组空值?分享 1 段优质 JS 代码片段!

本内容首发于工粽号:程序员大澈,每日分享一段优质代码片段,欢迎关注和投稿!大家好,我是大澈!本文约 600+ 字,整篇阅读约需 1 分钟。今天分享一段优质 JS 代码片段,用最简洁的代码清除了数组中的...