Ecmascript 6新特性

  1. 声明变量由var变成let。let实际上为JavaScript新增了块级作用域。let与var相比具有的特性有
1、不允许重复声明一个变量
var a=5;
var a=7;
let b=6;
let b=8;//Uncaught SyntaxError: Identifier ‘a‘ has already been declared重复声明变量报错,而var重复声明的变量不会报错
2、不存在变量提升,也就是预解析过程。只有变量声明后才可以调用,在该变量声明前使用会报错
console.log(a);//undefined     var存在变量提升过程
var a = 6;
console.log(b);//ReferenceError: b is not defined不存在变量提升过程
let b = 8;

3、let声明的变量具有作用域,只在代码块内有作用域。只在块级作用域内有效。
    for(let i=0;i<6;i++){
        console.log(i);
    }
    console.log(i);//ReferenceError: i is not defined  i只在for循环有效
    //var声明的在全局内有效
    for(var j=0;j<6;j++){
        console.log(j);
    }
    console.log(j);//6

4、暂时性死区:只要块级作用域内存在let命令,它所声明的变量就“绑定”这个区域,在代码块内,使用let命令声明变量之前,该变量都是不可用的。
var tmp = 123;

if (true) {
  tmp = ‘abc‘; // ReferenceError
  let tmp;
}

利用let的块级作用域这一特性,可以用于for循环的计数,添加索引值以及立即执行的匿名函数不再需要了。

//a[i]为DOM元素按钮的集合,点击按钮添加事件
for (let i = 0; i < 10; i++) {
  a[i].onclick = function () {
    console.log(i);
  };
}

2.块级作用域:主要还是通过let来实现。{}表示代码块。只在代码块内有效

{
      let a=4;
}
console.log(a);//报错

3、使用const定义一个只读的常量。一旦定义不可修改。且一旦定义必须初始化。

const a=5;
a=10;//报错  TypeError: Assignment to constant variable.const c;//报错  SyntaxError: Missing initializer in const declaration

若为引用类型,因为变量名不指向数据,只指向数据所在地址,所以const命令只是保证变量名指向的地址不变,并不保证该地址的数据不变,例如

//若为数组
const arr = [1, 2, 3];
arr.push(4);
console.log(arr);  //[1,2,3,4]arr=[1,2,3,4];//报错
//若常量为对象
const obj = {name: ‘123‘};
obj.name = "hxc";
console.log(obj);//{name:‘hxc‘obj = {name:‘345‘};//报错

因此在定义对象或数组常量时要格外注意。const的其他特性与let一样,只在代码块内有效,不存在变量提升,暂时性死区。

4.解构赋值:ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。ES5之前对变量复制是指定值复制例如

var a = 1;
var b = 2;
var c = 3;

而es6允许解构赋值,例如

var [a,b,c] = [1,2,3];console.log(a,b,c);     //1,2,3var [c,d,e,f] = [1,[2],3];console.log(c,d,e,f);     //1,[2],3,undefined

数组的解构赋值是按照对应顺序结构,且允许数组嵌套,如果解构不成功则为undefined。

对象也可以解构赋值,根据对象的属性解构赋值,变量必须与对象的属性名相同。未解构到的返回undefined;与数组相同允许嵌套。

var obj = {
      name: ‘hxc‘,
      age: 18
 }
 var {name, age}=obj;

 console.log({name, age}); var {birth} = obj;            //undefined
时间: 2024-10-10 13:21:18

Ecmascript 6新特性的相关文章

ECMAScript 6 新特性-set。const

一.let命令是es6新增的特性,作用与var命令类似,声明变量,不同之处在于声明的变量的作用域为块级作用域.引入let后带来了很多新的特性. 1作用域,es5之前之后函数作用域和全局作用域,let的引入带来了块级作用域,块级作用于会带来很多新的改变. 2一个需要了解的是"暂时性死区",比如在全局变量tmp,但是块级作用域内let又声明了一个局部变量tmp,导致后者绑定这个块级作用域,所以在let声明变量前,对tmp赋值会报错. 3ES5 规定,函数只能在顶层作用域和函数作用域之中声明

ECMAScript 6新特性介绍

箭头函数 箭头函数使用=>语法来简化函数,在语句结构上和C#.Java 8 和 CoffeeScript类似,支持表达式和函数体..=>`操作符左边为输入的参数,而右边则是进行的操作以及返回的值. var sum = (num1, num2) => num1 + num2; // 等同于 var sum = function(num1, num2) { return num1 + num2; }; 关于this,绑定定义时所在的对象,而不是使用时所在的对象. var handler =

ECMAScript 6新特性之Proxy

ECMAScript 6中新增了一个全局构造函数:Proxy.该构造函数能够接收两个參数:一个目标对象.一个处理对象. 代码演示样例: var target = {}; var handler = {}; var proxy = new Proxy(target, handler); proxy将具有与target类似的内部属性/方法:handler能够作为proxy方法的拦截器.

ECMAScript 5 新特性

Strict模式 开启strict: 在文件头部,或者在一个function头部内,添加‘use strict’或者“use strict”. Strict模式的限制,以及违反时出现的异常: 新定制了未来可能会使用的一些保留字段 "implements", "interface", "let", "package", "private", "protected", "publi

前端开发者进阶之ECMAScript新特性--Object.create

前端开发者进阶之ECMAScript新特性[一]--Object.create Object.create(prototype, descriptors) :创建一个具有指定原型且可选择性地包含指定属性的对象 参数:prototype 必需.  要用作原型的对象. 可以为 null.descriptors 可选. 包含一个或多个属性描述符的 JavaScript 对象."数据属性"是可获取且可设置值的属性. 数据属性描述符包含 value 特性,以及 writable.enumerab

ECMAScript 6的一些新特性2

看下ES6数组的一些新特性, 把类数组转换为真正的数组 'use strict'; var aDiv = document.getElementsByTagName('div'); var eles = Array.from( aDiv ); console.log( eles ); 同样的方法也可以转字符串 'use strict'; var str = 'abcd'; var eles = Array.from( str ); console.log( eles ); 数组的实例方法arr.

Atitit js es5 es6新特性 attilax总结

1.1. JavaScript发展时间轴:1 1.2. 以下是ES6排名前十的最佳特性列表(排名不分先后):1 1.3. Es6 支持情况 基本chrome ff 360se8全面支持了2 2. ECMAScript 2015(ES6)的十大特征 – WEB前端开发 - 专注前端开发,关注用户体验.html2 1.1. JavaScript发展时间轴: 1.1995:JavaScript诞生,它的初始名叫LiveScript. 2.1997:ECMAScript标准确立. 3.1999:ES3出

TypeScript系列1-1.5版本新特性

1. 简介 随着PC端快速向移动端迁移,移动(体验)优先的概念也越来越响.由于ReactJS目前移动端仅仅支持iOS,因此移动端Web开发框架只能选择: AngularJS/Angula2 + Ionic框架 + Cordova.想要学习好Angula2以及阅读其代码, 就必须了解和学习TypeScript,也因此需要学习好ES6以及Web Component.近期将开始学习TypeScript语言. 下面先看看TypeScript语言的发展: 鉴于JavaScript这种脚本语言很难应用于大规

Atitit nodejs5 nodejs6 &#160;nodejs 7.2.1 &#160;新特性attialx总结

Atitit nodejs5 nodejs6  nodejs 7.2.1  新特性attialx总结 1.1. Node.js 4.0.0 已经发布了 .这是和 io.js 合并之后的首个稳定版本,它带来了一系列的新特性,支持 ES 6的大部分特性1 1.2. 10月29日发布了Node.js 5.0,至此Node.js 4.0进入了长期服务支持阶段(LTS),5.0成为稳定版本.Node.js 5.x系列采用快速发布模式,计划1~2周完成一个发布.1 1.3. Node.js 6覆盖了93%的