ES6_阮一峰

学习网址

简介

1.Node.js

Node.js是JS的服务器运行环境,对ES6的支持度更高
除了那些默认打开的功能,还有一些语法功能已经实现了,但默认没打开

2.Babel转码器

可以将ES6代码转为ES5代码,从而在老版本的浏览器执行

Babel的配置文件是.babelrc,存放在项目的根目录下。使用Babel的第一步,就是配置这个文件

node

一个基于Chrome V8引擎的JavaScirpt运行环境

块级作用域

块级作用域

ES6新增了块级作用域——之前是全局作用域和函数作用域
块作用域由{ }包括,if语句和for语句里面的{ }也属于块作用域

——如果不写{},JS引擎认为不存在块级作用域,let和函数声明只能出现在当前作用域的顶层

在代码块内,用let声明变量前,该变量都是不可用的
这在语法上,称为“暂时性死区”——本质:只要一进入当前作用域,要使用的变量就已经存在了,但是不可获取,只有等到声明变量的那一行代码出现,才可以获取和使用该变量

在块级作用域内声明函数

类似于var,存在函数声明提升——环境导致的行为差异太大
——避免在块级作用域内声明函数
——写成函数表达式,而不是函数声明语句

为什么需要块级作用域?

1.内层变量可能会覆盖外层变量——块级作用域:不受内层代码块的影响
2.用来计数的循环变量可能会泄露为全局变量

let、const和var的区别(自己写的)

不可变量声明提升
会存在暂时性死区——获取和使用
只在代码块内有效
只能声明一次,不可重复声明

let

只在所声明的代码块内有效

for循环的计数器就很适合用let:
for循环的特别之处——设置循环变量的部分和循环体内部是不同的作用域

const

const一旦声明必须立即初始化,不能留到以后赋值
只声明不赋值,会报错!!

变量的值——变量指向的内存地址 所保存的数据

const实际上保证的不是变量的值不得改动,而是变量指向的内存地址所保存的数据不得改动
简单类型的数据(number、string、boolean)——值保存在变量指向的内存地址,等同于常量
复合型数据(数组、对象)——变量指向的内存地址保存的只是一个指向实际数据的指针,const只能保证这个指针是固定的

const foo = {};  //为foo添加一个属性,可以成功
foo.prop = 123;
foo.prop   //——123

foo = {};  //——将foo指向另一个对象,就会报错

——常量foo储存的是一个地址,这个地址指向一个对象
不可变的只是这个地址,即不能把foo指向另一个地址
但对象本身是可变的,所以依然可以为其添加新属性

顶层对象的属性

顶层对象,在浏览器环境指的是window对象,在node指的是global对象

解构赋值

1.数组:模式匹配——=两边模式相同,就会赋值

如果解构不成功——undefined

ES6新数据结构:Set

本身是一个构造函数——用来生成Set数据结构
类似于数组,但成员的值都是唯一的,没有重复的值

去除数组的重复成员
new Set(arr)

区别:向Set加入值是NaN等于自身!!
      2个空对象是不相等的

Set实例的方法分为2大类:
1.操作方法(操作数据)

Set.prototype.add(value):添加某个值,返回Set结构本身
Set.prototype.delete(value):删除某个值,返回Boolean,表示删除是否成功
Set.prototype.has(value):返回Boolean,表示该值是否为Set的成员
Set.prototype.clear():清除所有成员,没有返回值

2.遍历方法(遍历成员)

——都返回遍历器对象,Set结构没有键名只有键值,所以keys和values方法行为一致
Set.prototype.keys():返回键名的遍历器
Set.prototype.values():返回键值的遍历器
Set.prototype.entries():返回键值对的遍历器

Set.prototype.forEach():使用回调函数遍历每个成员
参数:键值value、键名key、集合

Set的遍历顺序就是插入顺序:
使用Set保存一个回调函数列表,调用时能保证按添加顺序调用

Array.from(待转换数组、函数、?执行函数时的this对象)

类数组对象/可遍历对象——>真正的数组(返回值)

数组去重方法:
function dedupe(arr){
   return Array.from(new Set(arr));
}
dedupe([1,2,1,4]);

function*

会定义一个生成器函数(generator function),返回一个Generator对象
生成器函数在执行时能暂停,后面又能从暂停处继续执行
调用一个生成器函数并不会马上执行它里面的语句,而是返回一个这个生成器的 迭代器(iterator)对象
当这个迭代器的next()方法被首次(后续)调用时,其内的语句会执行到第一个(后续)出现yield的位置为止,yield后紧跟迭代器要返回的值。或者如果用的是yield*(多了个星号),则表示将执行权移交给另一个生成器函数(当前生成器暂停执行)

next()方法返回一个对象,这个对象包含2个属性:value和done
value:本次field表达式的返回值
done:Boolean,表示生成器后续是否还有 yield 语句,即生成器函数是否已经执行完毕并返回

箭头函数

(参数)=>返回值

匿名函数

匿名函数
1.好处

减少全局变量/某作用域内变量 的污染
使代码结构更优美,如代码可以实现块状分布

2.使用

1.函数表达式
将匿名函数赋值给变量
var fn=function(){}

回调函数

JS回调函数——简单易懂有实例

被作为参数传递的函数

机制:⑴定义一个回调函数
      ⑵提供函数实现的一方在初始化的时候,将回调函数的函数指针注册给调用者
      ⑶当特定的事件或条件发生的时候,调用者使用函数指针调用回调函数对事件进行处理

回调函数就是允许用户把需要调用的函数的指针作为参数传递给一个函数,以便该函数在处理相似事件时可以灵活的使用不同的方法

字符串的扩展

Unicode码:万国码、单一码
UTF-8:针对Unicode的一种可变长度字符编码

\uxxxx表示一个字符,其中xxxx表示字符的Unicode码点
改进:可将码点放入{}

6种方法表示一个字符:
'\z' === 'z'  // true
'\172' === 'z' // true
'\x7A' === 'z' // true
'\u007A' === 'z' // true
'\u{7A}' === 'z' // true

字符串的遍历器接口

使得字符可以被for...of循环遍历
for (let codePoint of 'foo') {
  console.log(codePoint)
}

字符串的新增方法

1.String.fromCodePoint()

可识别大于0xFFFF的字符——定义在String对象上
用于从Unicode码点返回对应字符

与codePointAt()相反——定义在字符串的实例对象上
以0开头:八进制
以0x开头:十六进制  

2.String.raw()往往用于处理模板字符串的方法
本质是一个正常的函数
会将所有变量替换,且对\进行替换

返回一个斜杠都被转义(即斜杠前面再加一个斜杠)的字符串

模板字符串:`` 如果字符串中需要有反引号,前面加\
          普通字符串、定义多行字符串
           在(模板)字符串中嵌入变量——将变量写在${}里

数值的扩展

1.Number.isFinite(参数)——只对数值有效

不是数值——返回false

isFinite(25) // true
isFinite("25") // true
Number.isFinite(25) // true
Number.isFinite("25") // false    ——不是数值,返回false

2.Number.isNaN(参数)——只对数值有效
——全局 isNaN() 函数将测试值转换为数字,然后对其进行测试

只有NaN——返回true

isNaN(NaN) // true
isNaN("NaN") // true
Number.isNaN(NaN) // true
Number.isNaN("NaN") // false   ——本质还是字符串
Number.isNaN(1) // false
二进制和八进制新写法:0b(0B)、0o(0O)

2.Number.parseInt()、Number.parseFloat()

逐步减少全局性方法,使得语言逐步模块化

3.Number.isInteger()判断是否为整数

JavaScript 内部,整数和浮点数采用的是同样的储存方法,所以25和25.0被视为同一个值
Number.isInteger(25) // true
Number.isInteger(25.0) //true

不是数值直接返回false
如果对精度要求较高,不建议使用
    数值精度最多可以达到53个二进制位,后面的会被丢弃
    如果一个数值的绝对值小于Number.MIN_VALUE(5E-324)(能够分辨的最小值),会被自动转为0

4.Math对象——不是number会先转化成number
关于Math对象上新增了17个与数学相关的方法

无构造函数Math()

原来:
Math.PI  //返回π的值
Math.sqrt(16)  //返回平方根4 
Math.abs(x)   //返回绝对值
Math.ceil(x)  //对数进行上舍入
Math.floor(x)  //对数进行下舍入
Math.round(x)  //四舍五入
Math.log(x) 
Math.max(x,y,z,...,n)  //返回 x,y,z,...,n 中的最高值
Math.min(x,y,z,...,n)  //返回 x,y,z,...,n中的最低值
Math.random()  //返回0~1之间的随机数
新增:都是静态方法,只能在Math对象上调用

Math.trunc()  //去除小数,返回整数部分
     非数值:内部使用Number()先转化为数值
     空值和无法截取整数的值,返回NaN
         Math.trunc(NaN);      // NaN
         Math.trunc('foo');    // NaN
         Math.trunc();         // NaN
         Math.trunc(undefined) // NaN
Math.sign(),,,

5.BigInt数据类型

没看,,,,,,,,,,,,,,,,,,,,,,,

静态方法、动态方法

在js中动态方法与静态方法的区别

静态方法:在构造函数本身上定义的方法,只能通过构造函数本身调用,new出的对象不能调用
动态方法:实例方法,通过prototype原型对象添加,所有的实例对象都能够集成调用

函数的扩展

不想看了,,,,,,,,,,,,,,
  • 2
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值