温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

ES6中有哪些特性

发布时间:2021-08-19 09:44:23 来源:亿速云 阅读:107 作者:小新 栏目:web开发

这篇文章给大家分享的是有关ES6中有哪些特性的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

1.Object Shorthand

新的对象声明方法允许我们可以不声明对象的 key :

var x = 12;
var y = yes;
var z = {one:'1',two:'2'};

// The old way
var obj = {
 x:x,
 y:y,
 z:z
}
// The new way
var obj = {x,y,z};

2.Method Properties

避免 function 关键字声明函数:

var davidwalsh = {
 makeItHappen(param){
 // do stuff
 }
}

必须承认去除掉 function 关键字确实使代码简洁、更好维护。

3.Blocks vs Immediately Executed Functions

下面创建立即执行方法的模式有点难看:

(function(){
 // do stuff
})();

通过ES6我们可以通过 {} 和 let 来创建块级作用于,完成立即执行函数的作用:

{
 let j = 12;
 let divs = document.querySelectorAll('div');

 // do stuff
}

j; // ReferenceError: j is not defined...

如果在 Block 内部声明函数,它将会被外部访问到。但你如果使用 let 关键字声明函数自变量,将不使用括号的情况下实现 IEF 的功能。

4. for loops and let

因为在JS里面会存在变量提升,我们经常会在作用域前面声明一些”无用”的迭代变量,例如(for var x = …)。ES6 使用 let 解决了此恼人的问题:

for(let x = 0; x < len; i++){
 //do stuff
}

x; // ReferenceError: x is not defined

不久以后 let 会被应用的更多。

5.get and set for Classes

class Cart{
 constructor(total){
 this._total = total;
 }
 get total(){return this._total;}
 set total(v){this._total = Number(v);}
}

var cart = new Cart(100);

cart.total // 100

能为属性设置 get、set 是这部分最棒的。不需要使用函数来进行特殊的设定–当执行 obj.prop = {value} 时,一切都会自动执行。

6.startsWith,endsWith and includes

"MooTools".startsWith("Moo"); // true;
"MooTools".startsWith("moo"); // false;

"MooTools".endsWith("Tools"); // true;

"MooTools".includes("oo"); // true;

注:includes 方法兼容性还是很多,曾有一个线上bug,就是因为不支持此方法导致的。

感谢各位的阅读!关于“ES6中有哪些特性”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

es6
AI