ES6/ES2015,,在ES5的基础上扩展了很多新的功能,在使用的时候要慎重,因为有一部分js代码在部分浏览器是不兼容的,但是所有写在服务器端的代码基本上都支持ES6的写法.

新特性:

一.开启严格模式

在函数的第一行加上"use strict"字符串,如果需要整个js代码中开启,就在js第一行加上这一段字符.

设置"严格模式"的目的,主要有:

  • 清除javascript语法的一些不合理,不严谨之处,减少怪异行为
  • 清楚代码运行的一些不安全之处,保证代码运行的安全.
  • 提高编译效率,增加运行速度
  • 为未来新版本的javascript做好铺垫.

注意:

在正常模式下可以直接使用为未声明的变量 严格模式不行

name="jhon";
console.log(name);
//输出jhon

在正常模式下一个方法可以有很多个同名参数 严格模式不行

function fn(aa,aa,bb){
return aa+aa+bb;
}
console.log(fn("11","22","33"));
//输出222233

二.定义变量使用let(类似var)

javascript中的var:

  • var声明的变量会有变量提升
  • var没有块级作用域
  • var可以多次重复定义一个变量

这些声明在后天开发语言是不允许的,为了规范变量的声明ES6退出了新的关键字let代替var的声明变量.

let的特点:

  • let声明的变量不会有变量提升
  • let存在块级作用域
  • let不能多次重复定义变量

三.定义常量const

常量是指不会改变的数据.

常量const的特点:

  • 值不能再改变
  • 常量具有块级作用域
  • 不要在块级作用域中声明常量
  • 没有变量提升,要先声明后使用
  • 不可以声明同名的常量
  • 一定要赋初始值,否则会报错
  • 如果声明的是常量是一个对象,只要对象的地址不改变,其内部的属性可以改变

四.字符串的扩展

如果要判断字符串”hello word”中是否存在”word”,用字符串中的方法只有indexOf,在ES6中又为我们提供了其它的方法:

  • includes()->返回布尔值,用于判字符串是否包含某些字符串
  • startsWith()->返回布尔值,用于判断字符串是否以某些字符开头
  • endWith()->返回布尔值,用于判断字符串是否以缪谢字符结尾.有两个参数(字符串,数值)->("o",3)用于判断下标3的字符串是否是"0".
  • repeat()->传入一个数字,将字符串重复数字对应的次数返回.

注意:传入的是正小数,数字会被向下取整;传入字符串类型的数值("5"),可以,传入("5a")不可以当空处理;不能传入负数.

五.模块语法:"模块字符串"

结构:`模板内容${code}`

注意:code可以是变量,方法名,js表达式

 //变量
let name='jack';
let temp=`我叫${name}`;
//temp==>我叫jack //表达式
let a=1;
let b=1;
let temp=`a+b的和是$(a+b)`;
//temp==>2 //方法
function getName(){
return 'jack';
}
let temp=`我叫${getName()}`;
//temp==>jack

六.箭头函数 0=>{}

为了方便书写,es6规定了一种新的写法来简化匿名函数:去掉function改为=>,结构为()=>{}

过程一:去掉function关键字

arr.each(function(m,n){
              console.log(n)

});

得到:arr.each((m,n)=>{console.log(n);});

过程二:如果只有一句代码可以去掉大括号和return关键字

得到: arr.each((m,n)=>console.log(n));

过程三:如果参数只一个,可以将参数中的小括号去掉。

得到: arr.each(n=>console.log(n))

过程四:如果代码只有一句,并且代码中return,可以去掉return.

得到: arr.sort((n,m)=>n-m);

注意:箭头函数没有固定的写法,它是根据当前方法的参数和方法的返回值来的

箭头函数中this指向问题:

  • 箭头函数没有自己的this,函数体内部写的this,会顺着作用域去找最近真实存在的this。

  • 箭头函数内部的this是定义时所在的对象,而不是使用时所在的对象,并且不会改变。

  • 箭头函数不能作为构造函数
  • 箭头函数中不存在arguments,箭头函数中的argument指向的是外层的arguments.

未完,待续...

ECMAscript6(ES6)新特性语法总结(一)的更多相关文章

  1. 34.js----JS 开发者必须知道的十个 ES6 新特性

    JS 开发者必须知道的十个 ES6 新特性 这是为忙碌的开发者准备的ES6中最棒的十个特性(无特定顺序): 默认参数 模版表达式 多行字符串 拆包表达式 改进的对象表达式 箭头函数 =&> ...

  2. 浅谈ES6新特性

    ES6的了解 新增模板字符串(为JavaScript提供了简单的字符串插值功能).箭头函数(操作符左边为输入的参数,而右边则是进行的操作以及返回的值Inputs=>outputs.).for-o ...

  3. ES6新特性概览

    本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用. ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代号harmony( ...

  4. ES6新特性简介

    ES6新特性简介 环境安装 npm install -g babel npm install -g babel-node //提供基于node的REPL环境 //创建 .babelrc 文件 {&qu ...

  5. 必须掌握的ES6新特性

    ES6(ECMAScript2015)的出现,让前端开发者收到一份惊喜,它简洁的新语法.强大的新特性,带给我们更便捷和顺畅的编码体验,赞! 以下是ES6排名前十的最佳特性列表(排名不分先后): 1.D ...

  6. 你不知道的JavaScript--Item24 ES6新特性概览

    ES6新特性概览 本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用. ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代 ...

  7. javascript ES6 新特性之 扩展运算符 三个点 ...

    对于 ES6 新特性中的 ... 可以简单的理解为下面一句话就可以了: 对象中的扩展运算符(...)用于取出参数对象中的所有可遍历属性,拷贝到当前对象之中. 作用类似于 Object.assign() ...

  8. 前端入门21-JavaScript的ES6新特性

    声明 本篇内容全部摘自阮一峰的:ECMAScript 6 入门 阮一峰的这本书,我个人觉得写得挺好的,不管是描述方面,还是例子,都讲得挺通俗易懂,每个新特性基本都还会跟 ES5 旧标准做比较,说明为什 ...

  9. ES6新特性概览1

    本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用. ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代号harmony( ...

随机推荐

  1. jemeter+badboy录制脚本

    Jmeter 是一个非常流行的性能测试工具,虽然与LoadRunner相比有很多不足,比如:它结果分析能力没有LoadRunner详细:很它的优点也有很多: l       开源,他是一款开源的免费软 ...

  2. 使用 Charles 获取 https 的数据

    1. 配置 Charles 根证书 首先打开 Charles: 然后如下图操作: 之后会弹出钥匙串,如果不弹出,请自行打开钥匙串,如下图: 系统默认是不信任 Charles 的证书的,此时对证书右键, ...

  3. js循环里进行回调,引用循环里的变量,发现只是最后值的问题

    做项目的时候,栽在一个小地方,是这样的 我有很多个坐标点,我想把这些坐标点都绑定一个事件,当点击了这个坐标点之后,发送一个ajax 请求,将坐标点的id 发出去,等待显示返回的数据 但是实际当中,无论 ...

  4. 用javascript实现禁止页面后退返回上一页的代码

    用javascript实现禁止页面后退返回上一页的代码:  有时候我们需要用户在点击了如下一步的按钮时,页面跳转到了下一个页面,这时想不允许用户返回后退到上一页,可以采用下面的方法:  在需要跳转的页 ...

  5. PHPcms的安装步骤

    http://www.phpcms.cn 制作良好习惯: 1.备份 2.随时保存 3.注释 在自己的PHP环境里 简历一个文件夹 比如命名为YiNong 访问安装地址,http://localhost ...

  6. js分享插件

    这是个在线版的分享插件 <div class="share-icon"> <span>分享:</span> <div class=&quo ...

  7. ACM-树重心的性质及动态维护

    本文转自http://fanhq666.blog.163.com/blog/static/81943426201172472943638/ 求树重心的方法:(NlogN) http://www.cnb ...

  8. RESTful API设计基本原则

    REST四个基本原则:1.使用HTTP动词:GET POST PUT DELETE:2.无状态连接,服务器端不应保存过多上下文状态,即每个请求都是独立的:3.为每个资源设置URI:4.通过XML JS ...

  9. 【起航计划 022】2015 起航计划 Android APIDemo的魔鬼步伐 21 App->Launcher Shortcuts 为某个非主Activity在Home Screen上建立一个快捷方式

    Android 操作系统对于<intent-filter>含有下列属性的Activity会在应用程序管理器(Launcher)显示一项,一般这个Activity对应于某个应用的主Activ ...

  10. 【Microsoft Azure学习之旅】测试消息队列(Service Bus Queue)是否会丢消息

    组里最近遇到一个问题,微软的Azure Service Bus Queue是否可靠?是否会出现丢失消息的情况? 具体缘由如下, 由于开发的产品是SaaS产品,为防止消息丢失,跨Module消息传递使用 ...