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

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

zonemu1周前 (07-23)技术文章9

关于 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,父组件子组件传值,provide(提供)和inject(注入)传值

父组件向子组件传值父子组件传递数据时,通常使用的是props和emit,父向子传递使用props,子向父传递使用emit。子组件接收3种方式// 1、简单接收 props:["title...

学习ES6- 入门Vue(大量源代码及笔记,带你起飞)

ES6学习网站: https://es6.ruanyifeng.com/箭头函数普通函数//普通函数 this 指向调用时所在的对象(可变) let fn = function fn(a, b) {...

react hooks自定义组件居然能这样做

前言  这里写一下如何封装可复用组件。首先技术栈 react hooks + props-type + jsx封装纯函数组件。类组件和typeScript在这不做讨论,大家别白跑一趟。接下来会说一下封...

GIT最佳实践,高效提升多团队协同开发效率

多个团队共同维护同一个微服务模块时,经常出现A团队已发布的功能,B团队提交测发布出现冲突或缺失,如何有效解决多团队共同维护的问题呢?常用的版本管理工具有GIT、SVN,这两种版本管理工具,各有千秋;虽...

(在线编辑DWG)网页CAD二开实现焊接符号绘制

前言在工程制图和制造领域,焊接符号(Welding Symbols)是用于表示焊缝类型、尺寸、位置以及工艺要求的标准化图形语言。广泛应用于机械设计、钢结构、船舶制造、压力容器等行业中,帮助技术人员理解...

前端学习又一大里程碑:html5+js写出歌词同步手机播放器

需要完整代码和视频请评论后加前端群470593776领取javascript进阶课题:HTML5迷你音乐播放器学习疲惫了,代码敲累了,听听自己做的的音乐播放器,放松与满足知识点:for循环语句,DOM...