ES6-函数参数

函数参数的默认值

ES6之前,不能直接为函数的参数指定默认值,只能采用变通的方法

function log(x,y){
    
    
    y = y || 'world';
    console.log(x,y);
}
log('hello');//hello world
log('hello','china') //hello china
log('hello','')//hello world

ES6 允许为函数的参数设置默认值,即直接写在参数定义的后面。

function log(x, y = 'World') {
    
    
  console.log(x, y);
}

log('Hello') // Hello World
log('Hello', 'China') // Hello China
log('Hello', '') // Hello

ES6 的写法还有两个好处:首先,阅读代码的人,可以立刻意识到哪些参数是可以省略的,不用查看函数体或文档;其次,有利于将来的代码优化,即使未来的版本在对外接口中,彻底拿掉这个参数,也不会导致以前的代码无法运行。

默认的表达式可以是一个函数

function getVal(val) {
    
    
    return val + 5;
}
function add2(a, b = getVal(5)) {
    
    
    return a + b;
}
console.log(add2(10));

在这里插入图片描述
设置默认值的小技巧
函数参数的默认值,最好从参数列表的右边开始设置 函数参数的默认值,最好从参数列表的右边开始设置 函数参数的默认值,最好从参数列表的右边开始设置

rest参数

ES6 引入 rest 参数(形式为...变量名),用于获取函数的多余参数,这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中。
例如

function add(...values) {
    
    
 
  let sum = 0;

  for (var val of values) {
    
    
    sum += val;
  }

  return sum;
}

add(2, 5, 3) // 10

在这里插入图片描述
上面代码的add函数是一个求和函数,利用 rest 参数,可以向该函数传入任意数目的参数。

数组展开运算符

1.根本区别

展开运算符:[3,1,2]->3,1,2
剩余参数: 3,1,2->[3,1,2]

2.区分剩余参数和展开运算符

const add = (...args)=> {
    
    //剩余参数
	console.log(...args);//展开运算符
};
add(1,2,3);

在这里插入图片描述

对象展开运算符

对象展开运算符就是把对象的属性罗列出来

空对象的展开

如果展开一个空对象,则没有任何效果

非对象的展开

如果展开的不是对象,则会自动将其转为对象,再将其属性罗列出来

字符串的展开

如果展开运算符后面是字符串,它会自动转成一个类似数组的对象,因此返回的不是空对象

对象中对象属性的展开

不会展开对象中的对象属性
例如

const apple = {
    
    
	feature: {
    
    
		taste: '甜'
	}
};
const pen = {
    
    
	feature: {
    
    
		color: '黑色',
		shape: '圆柱形'
	},
	use: '写字'
};
console.log({
    
    ...apple});
console.log({
    
    ...apple,...pen});

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_42042158/article/details/125849781
今日推荐