!
运算符:const isTrue = true;
const isFalse = false;
console.log(!isTrue); // 输出: false
console.log(!isFalse); // 输出: true
!!
运算符:含义: 用于将一个值转换为对应的布尔值(强制类型转换)。
用法示例:
const value = "Hello";
console.log(!!value); // 输出: true,任何非空字符串在布尔上下文中都是真值
?.
运算符 (可选链操作符):含义: 用于在对象属性访问中避免出现错误,当属性不存在或者为 null/undefined 时不会抛出异常,而是返回 undefined。
用法示例:
const person = {
name: "Alice",
address: {
city: "New York"
}
};
console.log(person.address?.city); // 输出: "New York"
console.log(person.address?.country); // 输出: undefined,因为属性不存在
??
运算符 (空值合并操作符):含义: 用于提供默认值,当左侧表达式的结果为 null 或 undefined 时,返回右侧表达式的值。
用法示例:
const defaultValue = "Default Value";
const nullValue = null;
console.log(nullValue ?? defaultValue); // 输出: "Default Value"
??=
运算符 (空值合并赋值操作符):含义: 用于在左侧操作数为 null 或 undefined 时,将右侧表达式的值赋给左侧操作数。
用法示例:
let variable = null;
const defaultValue = "Default Value";
variable ??= defaultValue;
console.log(variable); // 输出: "Default Value"
?.
和 ?.[]
运算符的组合 (可选链操作符):含义: 可以在对象属性或数组元素的访问中组合使用可选链操作符。
用法示例:
const data = {
items: [1, 2, 3],
};
console.log(data?.items?.[1]); // 输出: 2
console.log(data?.items?.[5]); // 输出: undefined,因为索引 5 不存在
?.()
运算符 (可选链操作符):含义: 可以在函数调用中使用可选链操作符,以防止调用不存在的函数。
用法示例:
const obj = {
greet: function () {
return "Hello, world!";
},
};
console.log(obj?.greet?.()); // 输出: "Hello, world!"
console.log(obj?.notExistingFunction?.()); // 输出: undefined,因为函数不存在
?.()
和 ?.[]
运算符的混合使用:含义: 可以混合使用可选链操作符来访问对象的属性和调用对象的方法。
用法示例:
const person = {
name: "Alice",
sayHello: function () {
return `Hello, ${this.name}!`;
},
};
console.log(person.name?.toUpperCase()); // 输出: "ALICE"
console.log(person.sayHello?.()); // 输出: "Hello, Alice!"
注意: !. 这是TypeScript的语法,叫非空断言操作符(non-null assertion operator),和?.相反,这个符号表示对象后面的属性一定不是null或undefined。
含义:!. 非空类型断言,表示确定某个标识符是有值的:
用法示例:
function aa(value?:string){
console.log(value!.length);
// console.log(value.length); //错误提醒:value is possibly 'undefined'.
}
aa('ppp');
// 注意: !.不传值, 编译JS后会报错, 建议使用?. 替代 !.
p:有不足的地方欢迎评论哦~