es6新增
首先要说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新增的更多相关文章
- ECMAScript简介以及es6新增语法
ECMAScript简介 ECMAScript与JavaScript的关系 ECMAScript是JavaScript语言的国际化标准,JavaScript是ECMAScript的实现.(前者是后者的 ...
- ES6新增的常用数组方法(forEach,map,filter,every,some)
ES6新增的常用数组方法 let arr = [1, 2, 3, 2, 1]; 一 forEach => 遍历数组 arr.forEach((v, i) => { console.log( ...
- ES6新增对象方法的访问描述符:get(只读)、set(只写)
Es6新增对象方法的访问描述符:get(只读).set(只写),可以直接使用,一般用于数据监听,用途类似于vue.$watch. var obj = { a:1, get bar() { return ...
- 浅谈ES6新增数据类型:Symbol
面试中喜闻乐见的问题就是问我们的ES6新增了哪些个新特性 这篇文章一起学习一下新增的数据类型:Symbol JS的原始数据类型:6种Boolean,String,Undefined,NULL,Numb ...
- ES6新增的数据类型Map和Set。
Javascript的默认对象表示方式 {} ,即一组键值对. 但是Javascript的对象有个小问题,就是键必须是字符串.但实际上Number或者其他数据类型作为键也是非常合理的. 为了解决这个问 ...
- es6 新增字符串方法
es6新增了4个字符串处理的方法:startsWith,endsWith,includes,repeat. 1.简单使用 includes()返回布尔值,表示是否找到了参数字符串 startsWith ...
- es6新增功能
声明命令 1. let命令 ES6新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效.下面代码在代码块之中,分别用let和var声明了两个变量.然 ...
- ES6 新增的一些东西
一.常量 不允许重复定义 const a='HELLO' const a='world'//报错Uncaught SyntaxError: Identifier 'a' has already bee ...
- es6新增的数组方法和对象
es6新增的遍历数组的方法,后面都会用这个方法来遍历数组,或者对象,还有set,map let arr=[1,2,3,4,3,2,1,2]; 遍历数组最简洁直接的方法法 for (let value ...
随机推荐
- 3-51单片机WIFI学习(开发板8266底层源码介绍)
上一篇链接 http://www.cnblogs.com/yangfengwu/p/8743502.html 直接上源码:注意源码有两部分,第一部分是一开始的时候写在模块内部的,另一部分是存在手机内 ...
- vmvare入门(1)使用移动,不要使用复制
1.复制虚拟机会产生新的自动网卡,原来的 System Eth0废了? 2.xftp链接的时候,要选择sftp方式连接,utf8编码.
- Python基础题
1. 执行Python脚本的两种方式: Chmod +x 脚本 ./脚本(路径的方式) Python 脚本 2. 简述位.字节的关系 一个字节=8位 3. 简述ASCII.unicode.utf-8/ ...
- Codeforces Round #441 (Div. 2, by Moscow Team Olympiad) B. Divisiblity of Differences
http://codeforces.com/contest/876/problem/B 题意: 给出n个数,要求从里面选出k个数使得这k个数中任意两个的差能够被m整除,若不能则输出no. 思路: 差能 ...
- AtomicInteger类的理解及使用
AtomicInteger在多线程并发场景的使用 AtomicInteger提供原子操作来进行Integer的使用,因此十分适合高并发情况下的使用. AtomicInteger位于包package j ...
- Spring之事务管理
事务管理对于企业应用至关重要.它保证了用户的每一次操作都是可靠的,即便出现了异常的访问情况,也不至于破坏后台数据的完整性. 就像银行的自助取款机,通常都能正常为客户服务,但是也难免遇到 ...
- nginx location的命中过程
1 先判断精准命中,立即返回结果并结束解析过程 2 判断普通命中,如果有多个命中,"记录"下"最长"的命中结果(注意:记录但不结束,最长的为准) 3 继续判断正 ...
- WPF 自定义TreeView控件样式,仿QQ联系人列表
一.前言 TreeView控件在项目中使用比较频繁,普通的TreeView并不能满足我们的需求.因此我们需要滴对TreeView进行改造.下面的内容将介绍仿QQ联系人TreeView样式及TreeVi ...
- sql serve 数据库游标的使用
什么是游标? 通俗来讲,个人理解,游标是对一个查询结果集,每次取出一条数据进行处理操作. 使用场景: 例如,我们要修改一个表300条数据,且每条数据修改的内容不一样,那么平时用的update ...
- Spring Cloud Eureka 自我保护机制
Eureka Server 在运行期间会去统计心跳失败比例在 15 分钟之内是否低于 85%,如果低于 85%,Eureka Server 会将这些实例保护起来,让这些实例不会过期,但是在保护期内如果 ...