js6语法

Object.keys(),Object.values(),Object.entries()

1:Object.keys方法,返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历属性的键名。

var obj = {
    
     foo: ‘bar‘, baz: 42 };
Object.keys(obj)   //  ["foo", "baz"]

2:Object.values方法返回一个数组,成员是参数对象自身的所有属性的键值。

var obj = {
    
     foo: ‘bar‘, baz: 42 };
Object.values(obj) //  ["bar", 42]
var obj = {
    
     100: ‘a‘, 2: ‘b‘, 7: ‘c‘ };
Object.values(obj) //  ["b", "c", "a"]

上面代码中,属性名为数值的属性,是按照数值大小,从小到大遍历的,因此返回的顺序是b、c、a。

3: Object.entries方法返回一个数组,成员是参数对象自身的所有属性的键值对数组。

var obj = {
    
     foo: ‘bar‘, baz: 42 };
Object.entries(obj)  //  [ ["foo", "bar"], ["baz", 42] ] 

除了返回值不一样,该方法的行为与Object.values基本一致。

函数简写

(a) => a * a 效果等同
(function(a) {
    
     return a * a; }).bind(this)

对象中方法简写

var o = {
    
    
  method() {
    
    
    return "Hello!";
  }
};

// 等同于
var o = {
    
    
  method: function() {
    
    
    return "Hello!";
  }
};

map

let m = new Map(); -
m.set(key, value); 
m.has(key); 
m.get(key).

还包括 .clear(), .delete(), .forEach(), .keys().
声明字符串
内容中可以直接出现换行符

let str = `
      <ul>
        <li>a</li>
        <li>b</li>
        <li>c</li>
      </ul>    
    `

变量拼接

let name1 = "悦悦";
let job = `${
      
      name1}是嫦娥的兔兔`;
console.log(job);

//${}是变量拼接的固定格式
·······

let

代码块内有效
不能重复声明
变量只能在声明后使用,在声明前使用会报错
for 循环计数器很适合用 let

for (let j = 0; j < 10; j++) {
    
    }

[…]三个点

const arr1 = [1, 2, 3, 4, 5];
const arr2 = [6, 7, 8, 9];
const arr3 = [...arr1, ...arr2];//合并数组
console.log(arr3.join("-")); //=>1-2-3-4-5-6-7-8-9

展开数组  ...[1,2,3] // 1 2 3

for…of迭代

// 迭代数组数组
let arr = ['a','b','c'];
for(let item of arr){
    
    
    console.log(item)
}
// logs 'a'
// logs 'b'
// logs 'c'

// 迭代字符串
let str = "abc";
for (let value of str) {
    
    
    console.log(value);
}
// logs 'a'
// logs 'b'
// logs 'c'

// 迭代map
let iterable = new Map([["a", 1], ["b", 2], ["c", 3]]
for (let entry of iterable) {
    
    
    console.log(entry);
}
// logs ["a", 1]
// logs ["b", 2]
// logs ["c", 3]

// 迭代map获取键值
for (let [key, value] of iterable) {
    
    
    console.log(key)
    console.log(value);
}

// 迭代set
let iterable = new Set([1, 1, 2, 2, 3, 3,4]);
for (let value of iterable) {
    
    
    console.log(value);
}
// logs 1
// logs 2
// logs 3
// logs 4

// 迭代 DOM 节点
let articleParagraphs = document.querySelectorAll('.article > p');
for (let paragraph of articleParagraphs) {
    
    
    paragraph.classList.add("paragraph");
    // 给class名为“article”节点下的 p 标签添加一个名为“paragraph” class属性。
}

// 迭代arguments类数组对象
(function() {
    
    
  for (let argument of arguments) {
    
    
    console.log(argument);
  }
})(1, 2, 3);
// logs:
// 1
// 2
// 3


// 迭代类型数组
let typeArr = new Uint8Array([0x00, 0xff]);
for (let value of typeArr) {
    
    
  console.log(value);
}
// logs:
// 0
// 255

猜你喜欢

转载自blog.csdn.net/qianqianyixiao1/article/details/131225667
js6