资讯专栏INFORMATION COLUMN

ES6学习总结(一)

_ipo / 3096人阅读

摘要:可以通过调用方法将创建一个新的类型的值,这个值独一无二,不与任何值相等。还可以使可扩展,在中,表达式被标准化为构造函数的一个方法,这意味着它是可扩展的。

前端发展的太快了,快到ES6,ES7出来之后,今年已经是ES8了,但是纵然前端发展很快,我们除了马不停蹄的学习新的技术之外,也要沉下心来,好好的潜心磨砺自己,本文是整理了自己学习ES6之后相关的知识要点,寄希望于书之于笔,一来自己可以更好地领悟,而来也可以留作日后翻阅查看。

ES6新增的知识点主要包括变量声明let以及const,新增类型symbol,模板字符串,语法糖实现类,用于异步调用的promise对象,模块化,箭头函数,rest参数以及参数默认值,Set和Map集合,for of循环和迭代器iterator以及Generator等等,可以看出,ES6较之于ES5还是有着很多的新增特性,接下来会分为几篇文章将其一一介绍。

let和const

在JavaScript中咱们以前主要用关键var来定义变量,ES6之后,新增了定义变量的两个关键字,分别是let和const

对于变量来说,在ES5中var定义的变量会提升到作用域中所有的函数与语句前面,而ES6中let定义的变量则不会,let声明的变量会在其相应的代码块中建立一个暂时性死区,直至变量被声明。

//var声明变量
console.log(x === undefined); // "true"
var x = 3;
//let声明变量
console.log(x === undefined); // Uncaught ReferenceError: x is not defined
let x = 3;

从上面的代码可以看出来,使用let我们可以伪造一个代码块,终于不再局限于函数作用域中,而且对于代码也会更加的规范,使用let定义变量,提倡人们先定义再使用,不然会报错。

const主要作用于定义常量,而且一旦声明,初始必须赋值,并且变量值不能更改,否则会报错

const CALA;
//Missing initializer in const declaration
const CALA="calabash519"
CALA="hello world";
//Assignment to constant variable.

symbol

ES6 以前,我们知道5种基本数据类型分别是Undefined,Null,Boolean,Number以及String,然后加上一种引用类型Object构成了JavaScript中所有的数据类型,但是ES6出来之后,新增了一种数据类型,名叫symbol,像它的名字表露的一样,意味着独一无二,意思是每个 Symbol类型都是独一无二的,不与其它 Symbol 重复。

可以通过调用 Symbol() 方法将创建一个新的 Symbol 类型的值,这个值独一无二,不与任何值相等。

var mySymbol=Symbol();
console.log(typeof mySymbol) //"symbol"

其他类型可以被强制转换成字符串,但是Symbol 却不能,千万不要这么做,不然会报错,提示TypeError。

可以使用Symbol来定义对象的属性,而且当Symbol作为属性名的时候,必须用[]来进行调用而不是点操作符。

var obj = {};
var mySymbol = Symbol();
obj[mySymbol] = "calabash519";
console.log(obj[mySymbol]); //calabash519
console.log(obj.mySymbol); //undefined

Symbol还可以使 instanceof 可扩展,在 ES6 中,object instanceof constructor 表达式被标准化为构造函数的一个方法:constructor[Symbol.hasInstance](object),这意味着它是可扩展的。

模板字符串

字符串是JavaScript中基本类型之一,应该算是除了对象之外是使用最为频繁的类型吧,字符串中包含了例如substr,replace,indexOf,slice等等诸多方法,ES6引入了模板字符串的特性,用反引号来表示,可以表示多行字符串以及做到文本插值(利用模板占位符)。

// 以前的多行字符串我们这么写:
console.log("hello world 1

hello cala");
// "hello world
// hello cala"

//有了模板字符串之后
console.log(`hello world
string text line 2`);
// "hello world
// hello cala"

可以用${}来表示模板占位符,可以将你已经定义好的变量传进括弧中,例如:

var name="cala";
var age=22;
console.log(`hello,I"am ${name},my age is ${age}`)
//hello,I"am cala,my age is 22

上述是个很简单的例子,展示了模板字符串和模板占位符的基本用法,对比与普通字符串,模板字符串可以更好地支持自动转义特殊的字符串,也可以在其内嵌套控制语句,使得代码的逻辑更加清晰。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/87273.html

相关文章

  • ES6-7

    摘要:的翻译文档由的维护很多人说,阮老师已经有一本关于的书了入门,觉得看看这本书就足够了。前端的异步解决方案之和异步编程模式在前端开发过程中,显得越来越重要。为了让编程更美好,我们就需要引入来降低异步编程的复杂性。 JavaScript Promise 迷你书(中文版) 超详细介绍promise的gitbook,看完再不会promise...... 本书的目的是以目前还在制定中的ECMASc...

    mudiyouyou 评论0 收藏0
  • ES6解构赋值学习总结

    摘要:提供了解构赋值的方式,这样子在赋值多个变量或者进行注释时可以方便很多,不同场景下也有很多新的应用,个人常使用的有数组的解构赋值,对象的解构赋值和函数参数的解构赋值,函数参数的解构赋值之前总结过,这里写下数组的和对象的简单总结吧函数参数的解构 ES6提供了解构赋值的方式,这样子在赋值多个变量或者进行注释时可以方便很多,不同场景下也有很多新的应用,个人常使用的有数组的解构赋值,对象的解构赋...

    levinit 评论0 收藏0
  • ES6学习总结(1)

    摘要:返回一个对象,遍历对象自身和继承的所有可枚举属性不含,与相同和在红宝书中就已经提到过属性,表示的是引用类型实例的一个内部指针,指向该实例的构造函数的原型对象。 半个月前就决定要将ES6的学习总结一遍,结果拖延症一犯,半个月就过去了,现在补起来,惭愧惭愧。 阮一峰的《ES6标准入门》这本书有300页左右,除了几个新的API和js语法的扩展,真正有价值的内容并不多。所谓存在即合理,每部分的...

    happyfish 评论0 收藏0
  • 前端资源系列(4)-前端学习资源分享&前端面试资源汇总

    摘要:特意对前端学习资源做一个汇总,方便自己学习查阅参考,和好友们共同进步。 特意对前端学习资源做一个汇总,方便自己学习查阅参考,和好友们共同进步。 本以为自己收藏的站点多,可以很快搞定,没想到一入汇总深似海。还有很多不足&遗漏的地方,欢迎补充。有错误的地方,还请斧正... 托管: welcome to git,欢迎交流,感谢star 有好友反应和斧正,会及时更新,平时业务工作时也会不定期更...

    princekin 评论0 收藏0
  • ES6系统学习----对比var,let

    摘要:对于,虽然之前也有过学习,但总的来说还是不够系统的,知识点非常的零碎。因此包括以为基础产生的语法糖在逐渐的趋近于强类型的语言。是创建,而不是的覆盖。因而称之为富一代。所以语法标准的更新将对良好编程习惯有着极大的利好。 对于ES6,虽然之前也有过学习,但总的来说还是不够系统的,知识点非常的零碎。现在结合之前遇到的问题把ES6中的知识点总结一下。最初接触ES6时,明白ES5中声明变量的方式...

    ls0609 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<