JS中的扩展运算符(京东面试题)

JS中的扩展运算符一般用于以下情况:

  1. 数组和对象的拷贝
let arr = ['a', 'b'];
let arr1 = [...arr];
let [...arr2] = arr;
console,log(arr1, arr2);  // 输出['a', 'b'] ['a', 'b']
  1. 数组或对象的拼接
let arr = ['a', 'b'];
let arr1 = ['c'];
let arr2 = [...arr, ...arr1];
console.log(arr2); // 输出['a', 'b', 'c'];

// 这里需要注意的是:如果是对象的拼接,对于同一个key的键值对,后面的会覆盖前面的,如:
let obj1 = {name: 'xyp', age: 18};
let obj2 = {name: 'zyp'};
let obj3 = {...obj1, ...obj2};
console.log(obj); // 输出结果为{name: 'zyp', age: 18};
  1. 函数传参
// 解构赋值(析构赋值)
function add(...arr) {
   let sum = 0;
   arr[0] = 11;
   sum = arr.reduce((prev, cur) => {
       return prev + cur;
   }, 0);
   return sum;
}
let arr = [1,2];
let sum = add(...arr);
console.log(sum); // 得到的值是13
console.log(arr); // 得到的值依然是[1, 2]
// 我们知道,js中函数参数传递时按值传递的,并不是简单的赋值操作,而是在堆内存中重新开辟一块空间来存放传入的数组,再将该块内存中的地址传递给arr,其实这里就是深拷贝的意思,此时你对arr再做任何操作也影响不到外层arr了
apply方式
let arr = [1,2]
function add(x, y) {
	x= 5
	let sum = 0
	sum = x + y
	return sum
}
let sum= add.apply(add, arr)
console.log(sum) // 输出7
console.log(arr) //输出 [1, 2]

bind + call 方式
let sum2 = add.bind(add,1,2).call()
console.log(sum2) //输出7

当然,由于扩展运算符在传参时可以对参数进行结构赋值,所以以上bind+call方法在传参时可以改成如下:

 let sum2 = add.bind(add, ...arr).call()
 console.log(sum2) //输出7

因此对于传参时的结构赋值来说,我的理解是对部署了Symbol.iterator接口的数据类型进行解构。
可以将字符串解构成数组,将数组解构成’用逗号分隔的参数序列’

小技巧:

数组的push操作再也不用用循环啦
let arr1 = ['a', 'b']
let arr2 = ['c']
arr1.push(...arr2)

3 求取数组中的最大(小)值也可以直接使用Math.max啦
let arr = [1,2,3,4]
let max = Math.max(...arr)

将字符串转化成数组也很easy啦,不用借助match函数了。
let str = 'abcde'
let arr = [...str]

以前用match函数的实现:

let arr = str.match(/\w/g)

同时将其他部署了Symbol.iterator接口的对象转化成数组也更方便啦
var nodeList = document.querySelectorAll('div');  
var array = [...nodeList];  

京东面试题:

```javascript
var res = "hahha";
    var obj = {
        res : "heiheiehie",
        say: (...msg)=> {
            console.log(this.res, "hahha", ...msg);
        }
    }
    obj.say(1, 2, [1], "55555")
// 输出 hahha hahha 1 2 [1] 55555
// msg: [1, 2, [1], '55555'];


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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值