ES6语法大全

基本知识点

一、推荐在函数中使用 let 定义变量。
二、const 用来声明一个常量 (值类似值不能改变,引用类型地址不能改变)。
备注 let 和 const 只在最近的一个块中(花括号中)有效
三、ES6 数据类型除了 Number 、 String 、 Boolean 、 Object、 null 和 undefined ,还新增了 Symbol 。

重点----1.对象

允许对象的属性直接写变量,这时候属性名是变量名,属性值是变量值。

const age = 12;
const name = "Amy";
const person = {age, name};
person   //{age: 12, name: "Amy"}

对象方法名可以简写

const person = {
  sayHi(){
    console.log("Hi");
  }
}
person.sayHi();  //"Hi"

对象的拓展运算符
{…}就是遍历对象,赋值给左边对象

//普通用法
let person = {name: "Amy", age: 15};
let someone = { ...person };
someone;  //{name: "Amy", age: 15}
//可用于合并,后面的属性中key与前面的相同,后面覆盖前面
let age = {age: 15};
let name = {name: "Amy"};
let person = {...age, ...name};
person;  //{age: 15, name: "Amy"}

合并对象、数组等

Object.assign(target, source_1, ···)
//合并后赋值新的target

对象比较是否相等

Object.is(value1, value2)
//用来比较两个值是否严格相等,与(===)基本类似,但是更严格

重点----2.数组

构造方法
Array.of(参数,参数…)
Array.from([参数, 参数])

//form扩展用法
Array.from([1, 2, 3], (n) => n * 2)

let map = {
    do: function(n) {
        return n * 2;
    }
}
Array.from([1, 2, 3], function (n){
    return this.do(n);
}, map)); // [2, 4, 6]

类数组对象
Array.from({参数, 参数,length:长度})

Array.from({
  0: '1',
  1: '2',
  2: 3,
  length: 3
})

扩展方法:

//find()查到就输出值
let arr = Array.of(1, 2, 3, 4);
console.log(arr.find(item => item > 2)); // 3

//findIndex查到就输出下标
let arr = Array.of(1, 2, 1, 3);
// 参数1:回调函数
// 参数2(可选):指定回调函数中的 this 值
console.log(arr.findIndex(item => item = 1)); // 0

//fill(值,开始下标,结束下标)
console.log(Array.of(1, 2, 3, 4).fill(0,1,2)); 
// [1, 0, 3, 4]

//遍历键值对entries()
for(let [key, value] of ['a', 'b'].entries()){
    console.log(key, value);
}// 0 "a"  // 1 "b"

//遍历键名keys()
for(let key of ['a', 'b'].keys()){
    console.log(key);
}// 0 // 1 

//遍历键值values()
for(let value of ['a', 'b'].values()){
    console.log(value);
}

//包含includes(起始位置,值)
[1, 2, 3].includes(1);    // true
[1, 2, 3].includes(1, 2); // false

//对每个数组值进行操作flatMap()
console.log([1, 2, 3].flatMap(n => [n * 2])); 
// [2, 4, 6]

//☆复制数组☆
let arr = [1, 2],
    arr1 = [...arr];
console.log(arr1); // [1, 2]
//☆合并数组☆
[...[1, 2],...[3, 4]]

1.ES6中可以使用 => 作为函数表达形式

var foo = function(){return 1;};
//等价于
let foo = () => 1;

2.class类的概念

ES6中增加了类的概念

3.解构

解构赋值是ES6中推出的一种高效、简洁的赋值方法
例子:

//解构赋值
let [first, second, third] = someArray; //比上面简洁
//还有下面例子
let [,,third] = [1,2,3];
console.log(third); //3
let [first,...last] = [1,2,3];
console.log(last); //[2,3]

4.关于symbol

1.常规用法是当做对象属性名,能保证唯一

let sy = Symbol("key1");
 
// 写法1
let syObject = {};
syObject[sy] = "kk";
console.log(syObject);    // {Symbol(key1): "kk"}
 
// 写法2
let syObject = {
  [sy]: "kk"
};
console.log(syObject);    // {Symbol(key1): "kk"}
 
// 写法3
let syObject = {};
Object.defineProperty(syObject, sy, {value: "kk"});
console.log(syObject);   // {Symbol(key1): "kk"}

2.作为定义常量能保证常量独特唯一

const COLOR_RED = Symbol("red");

3.其他
单例模式:Symbol.for();
查看是否被登记:Symbol.keyFor();

5.Map 对象和Set 对象

1.map的迭代方法

for (var value of myMap.values()) {
  console.log(value);
}
myMap.forEach(function(value, key) {
  console.log(key + " = " + value);
}, myMap)

2.Set 对象
里面存唯一值,不重复

//set转数组(例子:{“A”,"B","C"}→[“A”,"B","C"])
var Array = [...Set];
//String 转 Set
var mySet = new Set('hello');  // Set(4) {"h", "e", "l", "o"}

基本函数方法:

//数组去重
var mySet = new Set([1, 2, 3, 4, 4]);
[...mySet]; // [1, 2, 3, 4]
//并集
var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var union = new Set([...a, ...b]); // {1, 2, 3, 4}
//交集
var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var intersect = new Set([...a].filter(x => b.has(x))); // {2, 3}
//差集
var a = new Set([1, 2, 3]);
var b = new Set([4, 3, 2]);
var difference = new Set([...a].filter(x => !b.has(x))); // {1}

6.Reflect 与 Proxy

看不懂!@

7.字符串

1.基本函数方法:includes||startsWith||endsWith

let string = "apple,banana,orange";
//includes():返回布尔值,判断是否找到参数字符串。
string.includes("banana");     // true
//startsWith():返回布尔值,判断参数字符串是否在原字符串的头部。
string.startsWith("apple");    // true
string.startsWith("banana",6)  // true
//endsWith():返回布尔值,判断参数字符串是否在原字符串的尾部。
string.endsWith("apple");      // false

2.字符串重复

"Hello,".repeat(2) // "Hello,Hello,"
/*小数点向下取整*/
console.log("Hello,".repeat(3.2));  // "Hello,Hello,Hello,"
/*repeat(NaN)、repeat( 0 至 -1 之间的小数)等价于repeat(0);*/

3.字符串补全
padStart: 从头插入补全
padEnd: 从尾插入补全

console.log("h".padStart(5,"o"));  // "ooooh"
console.log("h".padEnd(5,"o"));    // "hoooo"
console.log("h".padStart(5));      // "    h"
//ps:数字5表示最后的长度

4.模板字符串
使用`,定义多行字符串,还可以在字符串中加入变量和表达式。

<font color = blue>1.模板字符串中的换行和空格都是会被保留的</font>
<font color = blue>2.字符串可中调用函数,${f()}</font>
<font color = blue>2.字符串可中调用表达式和变量,${name}</font>

6.数值

基本方法函数:
Number.isFinite(某个数值)判断是否是有限
Number.parseInt(进制,某个数值)默认为10进制,取整数
扩展Math:
Math.cbrt计算一个数的立方根
Math.imul计算所有参数的平方和的平方根
Math.clz32返回数字的32 位无符号整数形式的前导0的个数
Math.trunc返回数字的整数部分
Math.fround获取数字的32位单精度浮点数形式
Math.sign判断数字的符号(负数返回-1,正数返回1,正负0返回正负0)
Math.expm1对数
Math.log1p(x)计算1 + x 的自然对数,即 Math.log(1 + x)
Math.log10(x)用于计算以 10 为底的 x 的对数

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值