js函数中参数设置默认值——基本用法-推荐、与解构赋值默认值结合、双重默认值 & js中的!!-非布尔类型值转为布尔类型值之对于null、undefined、0、“”都会被转为flase
应用场景
在进行封装函数时应改用——默认值设置,特别是某些多参数的函数。
ES6中给出了函数的默认值设置,下面简单介绍几种设置默认参数的方法
1、基本用法-推荐
function first(x = 1, y = 2) {
console.log("x:"+x ,"y:"+ y);
}
first(); // x:1 y:2
first(100); // x:100 y:2
2、与解构赋值默认值结合
function second({x, y = 2}) {
console.log("x:"+x ,"y:"+ y);
}
second({}); // x:undefined y:2
second({x:100}); // x:100 y:2
second({x:100,y:200}); // x:100 y:200
这种写法在传入多个形参时可以不按顺序写入,会方便很多,可是会有个问题,没有默认值时,每次都要传“{}”就会显得很麻烦,于是我们可以再设置一次默认值
3、双重默认值
function third({x = 1 ,y = 2} = {}) {
console.log("x:"+x ,"y:"+ y);
}
third(); // x:1 y:2
third({x:100,y:200}); // x:100 y:200
third({x:100}); // x:100 y:2
这种写法就不会出现易错的情况啦
4、vue方法中参数设置默认值
/**
* 获取表格数据
* @param {*} confirmVal 参数 1.1、初次进入页面-undefined 1.2、切换确认状态时-为字符串 2、切换分页和每页-false
*/
methods(confirmVal = false){
if (confirmVal === '0') {
console.log('此时为字符串类型')
}
const isFilter = !!confirmVal;
}
附:
4.1、js中的!!
alert(!!undefined)//false
alert(!!null)//false
alert(!!0)//false
alert(!!"")//fase
js代码中有时会用到 ! ,表示取反,对于布尔类型会将其值true和false互换,那对于非布尔类型呢?
对于非布尔类型,js会将值先转换成布尔类型,而后取反。
其他类型转布尔型的规则:
-
字符串类型值,会将空值(“”)转换成false,其余转换成true。
-
数字类型,会将0转换成false,其余为true。
-
null、undefined会转换成false。
因此,对于null、undefined、0、“”都会被转为flase。
一个!是将对象转为布尔型并取反,两个!是将取反后的布尔值再取反,相当于直接将非布尔类型值转为布尔类型值。
4.2、实例之!!
字符串类型值的转换
// 把value值转义为true
var a = '0';
console.log(a) // '0'
console.log(!a) // false
console.log(!!a) // true
// 把undefined转义为false
var b = undefined;
console.log(b) // undefined
console.log(!b) // true
console.log(!!b) // false
var c = false;
console.log(c) // false
console.log(!c) // true
console.log(!!c) // false
var d = true;
console.log(d) // true
console.log(!d) // false
console.log(!!d) // true