ES6基础

超、凢脫俗 2022-12-04 08:36 219阅读 0赞

let 和 const 命令

  1. // let声明的变量只在它所在的代码块有效,不存在变量提示，不受外部影响，不允许重复声明
  2. let a = 10;
  3. //const声明一个只读的常量。一旦声明，常量的值就不能改变
  4. const PI = 3.1415;

变量的解构赋值

  1. // 以前，为变量赋值，只能直接指定值。
  2. let a = 1;
  3. let b = 2;
  4. let c = 3;
  5. // ES6 允许写成下面这样。只要等号两边的模式相同，左边的变量就会被赋予对应的值，如果解构不成功，变量的值就等于undefined。
  6. let [a, b, c] = [1, 2, 3];
  7. // 解构不仅可以用于数组，还可以用于对象。变量必须与属性同名，才能取到正确的值。
  8. let { foo, bar } = { foo: 'aaa', bar: 'bbb' };
  9. // 对象的解构也可以指定默认值。
  10. var {x, y = 5} = {x: 1};
  11. //字符串也可以解构赋值
  12. const [a, b, c, d, e] = 'hello';
  13. a // "h"
  14. b // "e"
  15. c // "l"
  16. d // "l"
  17. e // "o"
  18. // 函数的参数也可以使用解构赋值。
  19. function add([x, y]){
  20.   return x + y;
  21. }
  23. add([1, 2]); // 3

字符串的扩展

  1. // 字符串的遍历
  2. for (let codePoint of 'foo') {
  3.   console.log(codePoint)
  4. }
  5. // 模板字符串 字符串中嵌入变量
  6. let name = "Bob", time = "today";
  7. `Hello ${name}, how are you ${time}?`

扩展运算符

  1. //扩展运算符（spread）是三个点（...）。它好比 rest 参数的逆运算，将一个数组转为用逗号分隔的参数序列。
  2. console.log(...[1, 2, 3])
  3. // 1 2 3
  4. console.log(1, ...[2, 3, 4], 5)
  5. // 1 2 3 4 5
  7. // 合并数组
  8. const arr1 = ['a', 'b'];
  9. const arr2 = ['c'];
  10. const arr3 = ['d', 'e'];
  11. // ES5 的合并数组
  12. arr1.concat(arr2, arr3);
  13. // [ 'a', 'b', 'c', 'd', 'e' ]
  14. // ES6 的合并数组
  15. [...arr1, ...arr2, ...arr3]
  16. // [ 'a', 'b', 'c', 'd', 'e' ]
  18. // 扩展运算符还可以将字符串转为真正的数组。
  19. [...'hello']
  20. // [ "h", "e", "l", "l", "o" ]
  22. // Array.from() 将对象转为真正的数组
  23. let arrayLike = {
  24.     '0': 'a',
  25.     '1': 'b',
  26.     '2': 'c',
  27.     length: 3
  28. };
  29. // ES6的写法
  30. let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']
  32. //Array.of方法用于将一组值，转换为数组。
  33. Array.of(3, 11, 8) // [3,11,8]
  34. Array.of(3) // [3]
  35. Array.of(3).length // 1

对象扩展

  1. // 简洁表示法
  2. const baz = {foo};
  3. baz // {foo: "bar"}
  5. // 等同于
  6. const baz = {foo: foo};
  8. // 合并对象方法
  9. const target = { a: 1 };
  10. const source1 = { b: 2 };
  11. const source2 = { c: 3 };
  12. Object.assign(target, source1, source2);
  13. target // {a:1, b:2, c:3}

Set数据结构

  1. // 去除数组的重复成员
  2. [...new Set(array)]
  4. // 去除字符串里面的重复字符。
  5. [...new Set('ababbc')].join('')
  6. // "abc"

发表评论

表情：
评论列表 （有 0 条评论，219人围观）

还没有评论，来说两句吧...

相关阅读

    相关 es6基础

    1.`let` 和`var`(面试题) `let`声明局部变量，只在当前代码块内有效，并且不能提前声明 一、 ![在这里插入图片描述][2019101500094

    曾经终败给现在曾经终败给现在/ 0 赞/ 67 阅读

    相关 ES6-基础-Symbol

    ES6中引入了一种新的基础数据类型：`Symbol`，不过很多开发者可能都不怎么了解它，或者觉得在实际的开发工作中并没有什么场景应用到它，那么今天我们来讲讲这个数据类型，并看看

    迷南。迷南。/ 0 赞/ 71 阅读

    相关 ES6基础

    let 和 const 命令 // let声明的变量只在它所在的代码块有效,不存在变量提示，不受外部影响，不允许重复声明 let a = 10; //

    超、凢脫俗超、凢脫俗/ 0 赞/ 220 阅读