js es6 字符串 数组 对象新方法 解构获取数据

// 一、 变量的解构 提取JSON的数据 函数返回的数据对象 遍历map解构
   function example() {
    return {
     foo: 1,
     bar: 2
    };
   }
   let { foo, bar } = example();

   let jsonData = {
    id: 42,
    status: "OK",
    data: [867, 5309]
   };

   let { id, status, data: number } = jsonData;

   // console.log(id, status, number);
   
   // 扩展:变量解构的常用实例
   // const { SourceMapConsumer, SourceNode } = require("source-map");

   // 二、 字符串的扩展  遍历字符串  常用的字符串模版
   for (let codePoint of 'foo') {
    // console.log(codePoint)
   }
   // 字符串新增的方法  常用的includes 替代 indexof, trim消除字符的空格比较常用 
   // includes() :返回布尔值,表示是否找到了参数字符串。
   // trim(): 消除字符串的空格

   // 三、 数值的扩展
   // Number.isFinite()用来检查一个值是否为有效的数值

   // 四、 数组的扩展  数组的合并 新写法  数组的includes方法 返回一个布尔值,表示某个数组是否包含给定的值

   const arr1 = ['a', 'b'];
   const arr2 = ['c'];
   const arr3 = ['d', 'e'];

   // ES5 的合并数组
   arr1.concat(arr2, arr3);
   // [ 'a', 'b', 'c', 'd', 'e' ]

   // ES6 的合并数组
   [...arr1, ...arr2, ...arr3]
   // [ 'a', 'b', 'c', 'd', 'e' ]
//  五、 对象的新方法  Object.assign 方法用于对象的合并
   const target = { a: 1 };
   const source1 = { b: 2 };
   const source2 = { c: 3 };

   Object.assign(target, source1, source2);

   //  六、 新增set结构  
    //  Array.from方法可以将 Set 结构转为数组。
   // 数组去重 新方法
   function dedupe(array) {
    return Array.from(new Set(array));
   }
   dedupe([1, 1, 2, 3]) // [1, 2, 3]

   // 七、 规范编码
   // 声明多个变量
   // bad
   var a = 1, b = 2, c = 3;
   // best
   const [a, b, c] = [1, 2, 3];
   // 获取数据 解构赋值
   const arr = [1, 2, 3, 4];
   // bad
   const first = arr[0];
   const second = arr[1];
   // good
   const [first, second] = arr;
   // 获取数据 解构复制 解构函数测参数
   // bad
   function getFullName(user) {
    const firstName = user.firstName;
    const lastName = user.lastName;
   }
   // good
   function getFullName(obj) {
    const { firstName, lastName } = obj;
   }
   // best
   function getFullName({ firstName, lastName }) {
   }
   // 数组 使用扩展运算符(...)拷贝数组。 
   // good
   const itemsCopy = [...items];
   
   // 使用 Array.from 方法,将类似数组的对象转为数组。
   const foo = document.querySelectorAll('.foo');
   const nodes = Array.from(foo);
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值