首先要说let,他是只在代码块中执行的变量,例如:

{
    let a = 10;
    var b = 1;
}
console.log(a);//defined
console.log(b);//1

面试题系列咱们说过,闭包的经典应用是在循环的时候:

var a = [];
for (var i = 0; i < 10; i++) {
    a[i] = function () {
        console.log(i);
    };
}
a[6](); // 10

这样是得不出你想要的结果的,以前只有利用闭包,但是现在我们有了let:

var a = [];
for (let i = 0; i < 10; i++) {
    a[i] = function () {
        console.log(i);
    };
}
a[6](); // 6

我们发现它神奇的执行了。另外let不允许重复声明,它主要就是应用在函数内部的块级作用域。另外还新增const只读常量,一旦声明就无法改变,作用域和let一样。

For...of循环:

let iterable = [10, 20, 30];
for (const value of iterable) {
    console.log(value);
}

我们不仅可以这样用它来循环数组,甚至能用它来循环字符串。

let iterable = "boo";
for (let value of iterable) {
    console.log(value);
}
// "b"
// "o"
// "o"

新增字符串遍历的三个方法,以前我们只有indexOf这个方法来来判定一个字符串,是否含在另外一个字符串中,它返回字符串首次出现的位置,这显然不能满足我们。

所以es6新增includes:返回布尔值,表示是否找到字符串。startsWith:返回布尔值,表示字符串是否在源字符串的头部位置。endsWith:返回布尔值,表示参数字符串是否在源字符串尾部。

var s = 'Hello world!';
s.startsWith('Hello') // true
s.endsWith('!') // true
s.includes('o') // true

三个方法都支持第二个参数,表示开始搜索的位置。

var s = 'Hello world!';
s.startsWith('world', 6) // true
s.endsWith('Hello', 5) // true
s.includes('Hello', 6) // false

 

字符串操作新增repeat方法,返回一个新字符串,表示将源字符串重复多少次。

'x'.repeat(3) // "xxx"
'hello'.repeat(2) // "hellohello"
'na'.repeat(0) // ""

字符串操作里面最麻烦的莫过于拼接字符串,为解决这个问题ec6提供了模板字符串解决方案。

$('#result').append(
        'There are <b>' + basket.count + '</b> ' +
        'items in your basket, ' +
        '<em>' + basket.onSale +
        '</em> are on sale!'
);

以前我们是这么写的,现在我们只需要这么写:

$('#result').append(`
  There are <b>${basket.count}</b> items
   in your basket, <em>${basket.onSale}</em>
  are on sale!
`);

记住开头结尾要加上反引号。模板中嵌入变量需要写在${}中。

Ec6里面终于新增了类的方法。以前我们我们是这么写构造函数的:

function Point(x, y) {
    this.x = x;
    this.y = y;
}

Point.prototype.toString = function () {
    return '(' + this.x + ', ' + this.y + ')';
};

var p = new Point(1, 2);

而现在有了类之后:

//定义类
class Point {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }

    toString() {
        return '(' + this.x + ', ' + this.y + ')';
    }
}

注意方法之间不要加逗号,否则会报错。

使用的时候我们直接new就可以了。

class Bar {
    doStuff() {
        console.log('stuff');
    }
}

var b = new Bar();
b.doStuff() // "stuff"

是不是简单方便了好多!其实类里面的方法,就等同于它的原型下面的方法。

class Point {
    constructor(){
        // ...
    
}

    toString(){
        // ...
    
}

    toValue(){
        // ...
    
}
}

// 等同于

Point.prototype = {
    toString(){},
    toValue(){}
};

es6新增的更多相关文章

  1. ECMAScript简介以及es6新增语法

    ECMAScript简介 ECMAScript与JavaScript的关系 ECMAScript是JavaScript语言的国际化标准,JavaScript是ECMAScript的实现.(前者是后者的 ...

  2. ES6新增的常用数组方法(forEach,map,filter,every,some)

    ES6新增的常用数组方法 let arr = [1, 2, 3, 2, 1]; 一 forEach => 遍历数组 arr.forEach((v, i) => { console.log( ...

  3. ES6新增对象方法的访问描述符:get(只读)、set(只写)

    Es6新增对象方法的访问描述符:get(只读).set(只写),可以直接使用,一般用于数据监听,用途类似于vue.$watch. var obj = { a:1, get bar() { return ...

  4. 浅谈ES6新增数据类型:Symbol

    面试中喜闻乐见的问题就是问我们的ES6新增了哪些个新特性 这篇文章一起学习一下新增的数据类型:Symbol JS的原始数据类型:6种Boolean,String,Undefined,NULL,Numb ...

  5. ES6新增的数据类型Map和Set。

    Javascript的默认对象表示方式 {} ,即一组键值对. 但是Javascript的对象有个小问题,就是键必须是字符串.但实际上Number或者其他数据类型作为键也是非常合理的. 为了解决这个问 ...

  6. es6 新增字符串方法

    es6新增了4个字符串处理的方法:startsWith,endsWith,includes,repeat. 1.简单使用 includes()返回布尔值,表示是否找到了参数字符串 startsWith ...

  7. es6新增功能

    声明命令 1. let命令 ES6新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效.下面代码在代码块之中,分别用let和var声明了两个变量.然 ...

  8. ES6 新增的一些东西

    一.常量 不允许重复定义 const a='HELLO' const a='world'//报错Uncaught SyntaxError: Identifier 'a' has already bee ...

  9. es6新增的数组方法和对象

    es6新增的遍历数组的方法,后面都会用这个方法来遍历数组,或者对象,还有set,map let arr=[1,2,3,4,3,2,1,2]; 遍历数组最简洁直接的方法法 for (let value ...

随机推荐

  1. c# BinaryWriter 和 BinaryReader

    string path = @"C:\Users\Administrator\Desktop\1.txt"; using (FileStream ws = new FileStre ...

  2. python3+beautifulSoup4.6抓取某网站小说(四)多线程抓取

    上一篇多文章,是二级目录,根目录"小说",二级目录"作品名称",之后就是小说文件. 本篇改造了部分代码,将目录设置为根目录->作者目录->作品目录- ...

  3. 【漏洞复现】PHPCMS wap模块 SQL注入(附EXP)

    漏洞影响版本:v9.5.8.v9.6.0 Step1: 访问:http://www.xxx.com/index.php?m=wap&a=index&siteid=1, 获取返回的coo ...

  4. hadoop2.6.0实践:000 虚拟机配置

  5. pandas.DataFrame.describe 官方文档翻译percentile_width,percentiles,include, exclude

     使用格式:DataFrame.describe(percentile_width=None, percentiles=None, include=None, exclude=None)  作用:生成 ...

  6. maven管理的jsp应用如何添加servlet、jsp相关依赖(org.apache.jasper.JasperException: java.lang.ClassNotFoundException: org.apache.jsp.index_jsp)

    背景: 老大让做权限控制,研究了一下shiro,下了个demo下来,死活跑不起来,报 org.apache.jasper.JasperException: java.lang.ClassNotFoun ...

  7. Spring(四):Spring整合Hibernate,之后整合Struts2

    背景: 上一篇文章<Spring(三):Spring整合Hibernate>已经介绍使用spring-framework-4.3.8.RELEASE与hibernate-release-5 ...

  8. Packer piplines and workflow

    packer对docker和aws AMI的支持都很好,来上个图: 配套的模版长这样: { "variables": { "name": "webim ...

  9. js字符串操作总结

    字符方法 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf- ...

  10. ConcurrentHashMap基于JDK1.8源码剖析

    前言 声明,本文用的是jdk1.8 前面章节回顾: Collection总览 List集合就这么简单[源码剖析] Map集合.散列表.红黑树介绍 HashMap就是这么简单[源码剖析] LinkedH ...