ES6新特性教程（二）

ES6数字操作
- 数字验证Number.isFinite( xx )：
  可以使用Number.isFinite( )来进行数字验证，只要是数字，不论是浮点型还是整形都会返回true，其他时候会返回false。
  let a= 11/4; console.log(Number.isFinite(a));//true console.log(Number.isFinite('jspang'));//false console.log(Number.isFinite(NaN));//false console.log(Number.isFinite(undefined));//false
- NaN验证:
  NaN是特殊的非数字，可以使用Number.isNaN()来进行验证。下边的代码控制台返回了true
  console.log(Number.isNaN(NaN));
- 判断是否为整数Number.isInteger(xx)：
  let a=123.1; console.log(Number.isInteger(a)); //false
- 整数转换Number.parseInt(xxx)和浮点型转换Number.parseFloat(xxx)
  let a='9.18'; console.log(Number.parseInt(a)); // 9 console.log(Number.parseFloat(a)); // 9.18
- 整数取值范围操作:
  整数的操作是有一个取值范围的，它的取值范围就是2的53次方
  let a = Math.pow(2,53)-1; console.log(a); //9007199254740991
- 最大安全整数
  console.log(Number.MAX_SAFE_INTEGER);
- 最小安全整数
  console.log(Number.MIN_SAFE_INTEGER);
- 安全整数判断isSafeInteger( )
  let a= Math.pow(2,53)-1; console.log(Number.isSafeInteger(a));//false

ES6中新增的数组知识

JSON数组格式转换（Array.from()）:

let  json = {
    '0': 'Hello',
    '1': '哈喽',
    '2': '你好',
    length:3
}
let arr=Array.from(json);
console.log(arr)  // ["Hello", "哈喽", "你好"]

文本或者变量转换成数组（Array.of()）:

let arr =Array.of(3,4,5,6); //转数字
console.log(arr); //[3, 4, 5, 6]
let arr =Array.of('Hello','哈喽','你好'); //转字符串
console.log(arr);  //["Hello", "哈喽", "你好"]

find( )实例方法（从数组中查找，传三个参数）
(实例的意思是指以数组开始的，数组的某个方法，而不是转成数组的方法)
value：表示当前查找的值。
index：表示当前查找的数组索引。
arr：表示当前数组。

let arr=[1,2,3,4,5,6,7,8,9];
console.log(arr.find(function(value,index,arr){
    return value > 5;
}))
//打印出 6，如果找不到会显示undefined

fill( )实例方法（填充数组）接收三个参数，第一个参数是填充的变量，第二个是开始填充的位置，第三个是填充到的位置。
```
let arr=[0,1,2,3,4,5,6,7,8,9];
arr.fill('Hello',2,5);
console.log(arr); //[0, 1, "Hello", "Hello", "Hello", 5, 6, 7, 8, 9]
```

数组的遍历
for…of循环:

let arr=['Hello','哈喽','你好']
for (let item of arr){
    console.log(item);  //Hello 哈喽 你好
}

for…of数组索引：

let arr=['Hello','哈喽','你好']
for (let index of arr.keys()){
    console.log(index);  // 0 1 2
}

同时输出数组的内容和索引:

let arr=['Hello','哈喽','你好']
for (let [index,val] of arr.entries()){
    console.log(index+':'+val);
  //0:Hello 1:哈喽 2:你好  
}

ES6中的箭头函数和扩展
- 可只传一个参数，可有默认值
```
function add(a,b=1){
    return a+b;
}
console.log(add(1));
```
- 函数中的严谨模式(在ES中就经常使用严谨模式来进行编程，但是必须写在代码最上边，相当于全局使用)要取消默认值的操作
```
function add(a,b){
    'use strict'
    if(a == 0){
        throw new Error('This is error');
    }
     return a+b;
}
console.log(add(1,2));
```
- 箭头函数
```
es5:
function add(a,b=1){
    return a+b;
}
console.log(add(1));
```
```
es6
var add =(a,b=1) => a+b;
console.log(add(1));
```
- {}的使用
  在箭头函数中，方法体内如果是两句话，那就需要在方法体外边加上{}括号
```
var add =(a,b=1) => {
    console.log('Hello')
    return a+b;
};
console.log(add(1));
```
箭头函数中不可加new，也就是说箭头函数不能当构造函数进行使用
- in的用法:
  in是用来判断对象或者数组中是否存在某个值的
  对象的判断：
  let obj={ a:'Hello', b:'哈喽' } console.log('a' in obj); //true
  数组的判断：
  let arr=[,,,,,]; console.log(0 in arr); //false let arr1=['Hello','哈喽']; console.log(0 in arr1); // true
注意：这里的0指的是数组下标位置是否为空
- 数组的遍历方法（forEach，filter，some，map四种方法）
  1. forEach （会自动省略为空的数组元素）
    let arr=['Hello','哈喽','你好']; arr.forEach((val,index)=>console.log(index,val));
  2. filter
    let arr=['Hello','哈喽','你好']; arr.filter(x=>console.log(x));
  3. some
    let arr=['Hello','哈喽','你好']; arr.some(x=>console.log(x));
  4. map
    let arr=['Hello','哈喽','你好']; console.log(arr.map(x=>'web'));
- 数组转字符串（join(),toString()两种方法）
  join():
  let arr=['Hello','哈喽','你好']; console.log(arr.join('|')); //Hello|哈喽|你好
  toString():
  let arr=['Hello','哈喽','你好']; console.log(arr.toString()); //Hello,哈喽,你好
ES6中对象
- 对象赋值：
  let name="Hello"; let skill= 'web'; var obj= {name,skill}; console.log(obj); //{name: "Hello", skill: "web"}
- Object.is( ) 对象比较(和===的比较)
  var obj1 = {name:'Hello'}; var obj2 = {name:'Hello'}; console.log(obj1.name === obj2.name);//true console.log(Object.is(obj1.name,obj2.name)); //true
  区别：
  console.log(+0 === -0); //true console.log(NaN === NaN ); //false console.log(Object.is(+0,-0)); //false console.log(Object.is(NaN,NaN)); //true
  ===为同值相等，is()为严格相等
- Object.assign( )合并对象
  var a={a:'Hello'}; var b={b:'哈喽‘}； var c={c:'web'}; let d=Object.assign(a,b,c) console.log(d);//{a: "Hello", b: "哈喽", c: "web"};
Symbol在对象中的作用
- Symbol的打印
  var g = Symbol('jspang'); console.log(g); //红色字 console.log(g.toString());//黑色字
- Symbol对象元素的保护作用
  let obj={name:'jspang',skill:'web'}; let age=Symbol(); obj[age]=18; //对年龄进行保护 for (let item in obj){ console.log(obj[item]); } //{name: "jspang", skill: "web", Symbol(): 18} console.log(obj);
Set和WeakSet数据结构
注意：是数据结构，而不是数据类型。
- Set的声明
  Set对象是值的集合，你可以按照插入的顺序迭代它的元素。 Set中的元素只会出现一次，即 Set 中的元素是唯一的
  声明：new Set([iterable]);（iterable是一个可迭代对象，其中的所有元素都会被加入到 Set 中。null被视作 undefined。也可以不传入[iterable]）
- Set属性：
  - Set.prototype.size:返回Set实例的成员数量。
    Set.prototype.constructor:默认的构造Set函数。
- Set方法：
  add(value):添加某个值，返回Set结构本身。
  delete(value):删除某个值，返回一个布尔值，表示删除成功。
  has(value):返回一个布尔值，表示参数是否为Set的成员。
  clear():清除所有成员，没有返回值。
  keys() :返回一个键名的遍历器
  values() :返回一个值的遍历器
  entries() :返回一个键值对的遍历器
  forEach():使用回调函数遍历每个成员
  例子：

add():
let setArr = new Set(['jspang','技术胖','web','jspang']);
console.log(setArr);//Set {"jspang", "技术胖", "web"}
setArr.add('前端职场');
console.log(setArr); //Set {"jspang", "技术胖", "web", "前端职场"}
setArr.delete('前端职场');
console.log(setArr); //Set {"jspang", "技术胖", "web"}

delete():
let setArr = new Set(['jspang','技术胖','web','jspang']);
console.log(setArr);//Set {"jspang", "技术胖", "web"}
setArr.add('前端职场');
console.log(setArr); //Set {"jspang", "技术胖", "web", "前端职场"}
setArr.delete('前端职场');
console.log(setArr); //Set {"jspang", "技术胖", "web"}

has():查找
用has进行值的查找，返回的是true或者fals
let setArr = new Set(['jspang','技术胖','web','jspang']);
console.log(setArr);//Set {"jspang", "技术胖", "web"}
console.log(setArr.has('jspang'));//true

clear():清空clear清除所有成员，没有返回值
let setArr = new Set(['jspang','技术胖','web','jspang']);
console.log(setArr);//Set {"jspang", "技术胖", "web"}
setArr.clear();
console.log(setArray);//true

s.add(1).add(2).add(2);  
// 注意2被加入了两次  

s.size // 2  

s.has(1) // true  
s.has(2) // true  
s.has(3) // false  

s.delete(2);  
s.has(2) // false

扩展运算符和 Set 结构相结合，就可以去除数组的重复成员
let arr = [3, 5, 2, 2, 5, 5];  
let unique = [...new Set(arr)];  
// [3, 5, 2]

let a = new Set([1, 2, 3]);  
let b = new Set([4, 3, 2]);  

// 并集  
let union = new Set([...a, ...b]);  
// Set {1, 2, 3, 4}   
// 交集  
let intersect = new Set([...a].filter(x => b.has(x)));  
// set {2, 3}   
// 差集  
let difference = new Set([...a].filter(x => !b.has(x)));  
// Set {1}

for…of…循环:
let setArr = new Set(['jspang','技术胖','web','jspang']);
for (let item of setArr){
    console.log(item);
} 
forEach循环:
let setArr = new Set(['jspang','技术胖','web','jspang']);
setArr.forEach((value)=>console.log(value)); //jspang,技术胖,web

WeakSet的声明
直接在new 的时候就放入值，将报错。WeakSet里边的值也是不允许重复

let weakObj=new WeakSet();
let obj={a:'jspang',b:'技术胖'}
weakObj.add(obj);
console.log(weakObj);

与Array相比：
Set中存储的元素是唯一的，而Array中可以存储重复的元素。
Set中遍历元素的方式：Set通过for…of…，而Array通过for…in…。
Set是集合，不能像数组用下标取值。

Map数据结构
Set类似于数组，而Map就类似于键值对（Key, Value）。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键

const map = new Map([  
  ['name', '张三'],  
  ['title', 'Author']  
]);   
map.size // 2  
map.has('name') // true  
map.get('name') // "张三"  
map.has('title') // true  
map.get('title') // "Author"

map方法：
size : 返回成员总数。
set(key, value) : 设置一个键值对。
get(key) : 读取一个键。
has(key) : 返回一个布尔值，表示某个键是否在Map结构中。
delete(key) : 删除某个键。
clear() : 清除所有成员。

set方法：新增
let json = {
    name:'jspang',
    skill:'web'
}
console.log(json.name);
var map=new Map();
map.set(json,'iam');
console.log(map);

get()取值：
console.log(map.get(json));

删除delete
删除delete的特定值：
map.delete(json);
console.log(map)

size属性
console.log(map.size);

查找是否存在has
console.log(map.has('jspang'))

清楚所有元素clear
map.clear()

ES6新特性教程（二）

ES6新特性教程（二）

猜你喜欢