JavaScript基礎(chǔ)之運算符與表達式詳解
一、===
嚴格相等運算符，用作邏輯判斷
1 == 1 // 返回 true 1 == '1' // 返回 true，會先將右側(cè)的字符串轉(zhuǎn)為數(shù)字，再做比較 1 === '1' // 返回 false，類型不等，直接返回 false
typeof查看某個值的類型
typeof 1 // 返回 'number' typeof '1' // 返回 'string'
二、||
需求，如果參數(shù)n沒有錯傳遞，給它一個【男】
推薦做法：
function test(n = '男') {
console.log(n);
}
你可能的做法：
function test(n) {
if(n === undefined) {
n = '男';
}
console.log(n);
}
還可能是這樣：
function test(n) {
n = (n === undefined) ? '男' : n;
console.log(n);
}
一些老舊代碼中的可能做法（不推薦）：
function test(n) {
n = n || '男';
console.log(n);
}
它的語法是：
值1 || 值2
如果值1 是 Truthy，返回值1，如果值1 是 Falsy 返回值 2
三、??與?.
??
需求，如果參數(shù)n沒有傳遞或是null，給它一個【男】
如果用傳統(tǒng)辦法：
function test(n) {
if(n === undefined || n === null) {
n = '男';
}
console.log(n);
}
用??
function test(n) {
n = n ?? '男';
console.log(n);
}
語法：
值1 ?? 值2
- 值1 是 nullish，返回值2
- 值1 不是 nullish，返回值1
?.
需求，函數(shù)參數(shù)是一個對象，可能包含有子屬性
例如，參數(shù)可能是：
let stu1 = {
name:"張三",
address: {
city: '北京'
}
};
let stu2 = {
name:"李四"
}
let stu3 = {
name:"李四",
address: null
}現(xiàn)在要訪問子屬性（有問題）
function test(stu) {
console.log(stu.address.city)
}
現(xiàn)在希望當(dāng)某個屬性是 nullish 時，短路并返回 undefined，可以用 ?.
function test(stu) {
console.log(stu.address?.city)
}
用傳統(tǒng)方法：
function test(stu) {
if(stu.address === undefined || stu.address === null) {
console.log(undefined);
return;
}
console.log(stu.address.city)
}
四、...
展開運算符
作用1：打散數(shù)組，把元素傳遞給多個參數(shù)
let arr = [1,2,3];
function test(a,b,c) {
console.log(a,b,c);
}
需求：把數(shù)組元素依次傳遞給函數(shù)參數(shù)
傳統(tǒng)寫法：
test(arr[0],arr[1],arr[2]); // 輸出 1,2,3
展開運算符寫法：
test(...arr); // 輸出 1,2,3
打散可以理解為【去掉了】數(shù)組外側(cè)的中括號，只剩下數(shù)組元素
作用2：復(fù)制數(shù)組或?qū)ο?/strong>
數(shù)組：
let arr1 = [1,2,3]; let arr2 = [...arr1]; // 復(fù)制數(shù)組
對象：
let obj1 = {name:'張三', age: 18};
let obj2 = {...obj1}; // 復(fù)制對象
注意：展開運算符復(fù)制屬于淺拷貝，例如：
let o1 = {name:'張三', address: {city: '北京'} }
let o2 = {...o1};
作用3：合并數(shù)組或?qū)ο?/strong>
合并數(shù)組：
let a1 = [1,2]; let a2 = [3,4]; let b1 = [...a1,...a2]; // 結(jié)果 [1,2,3,4] let b2 = [...a2,5,...a1] // 結(jié)果 [3,4,5,1,2]
合并對象：
let o1 = {name:'張三'};
let o2 = {age:18};
let o3 = {name:'李四'};
let n1 = {...o1, ...o2}; // 結(jié)果 {name:'張三',age:18}
let n2 = {...o3, ...o2, ...o1}; // 結(jié)果{name:'李四',age:18}
復(fù)制對象時出現(xiàn)同名屬性，后面的會覆蓋前面的
五、[] {}
[]
解構(gòu)賦值
用在聲明變量時：
let arr = [1,2,3]; let [a, b, c] = arr; // 結(jié)果 a=1, b=2, c=3
用在聲明參數(shù)時：
let arr = [1,2,3];
function test([a,b,c]) {
console.log(a,b,c) // 結(jié)果 a=1, b=2, c=3
}
test(arr);
{}
用在聲明變量時：
let obj = {name:"張三", age:18};
let {name,age} = obj; // 結(jié)果 name=張三, age=18
用在聲明參數(shù)時：
let obj = {name:"張三", age:18};
function test({name, age}) {
console.log(name, age); // 結(jié)果 name=張三, age=18
}
test(obj)以上就是JavaScript基礎(chǔ)之運算符與表達式詳解的詳細內(nèi)容，更多關(guān)于JavaScript運算符 表達式的資料請關(guān)注腳本之家其它相關(guān)文章！
相關(guān)文章
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)一個輸入框組件，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
本文主要介紹了js判斷是否是手機頁面的方法。具有很好的參考價值，下面跟著小編一起來看下吧2017-03-03
本文給大家分享的是在IOS瀏覽器中使用iscroll.js的上拉下拉刷新時當(dāng)手指劃出屏幕后無法回彈的解決方法，希望對大家能夠有所幫助。2016-02-02
本篇文章主要介紹了Webpack打包字體font-awesome的方法示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-04-04
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)動態(tài)表格效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-06-06
javascript 從定義到執(zhí)行，你應(yīng)該知道的那些事，本文為大家一一列舉，希望對大家的學(xué)習(xí)有所幫助2016-06-06
這篇文章主要為大家介紹了postMessage及webSocket跨域方案詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-10-10
javascript中mouseover、mouseout使用詳解
這篇文章主要介紹了javascript中mouseover、mouseout使用詳解的相關(guān)資料,需要的朋友可以參考下2015-07-07
這篇文章主要為大家詳細介紹了微信小程序?qū)崿F(xiàn)可長按移動控件，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-10-10
在網(wǎng)頁中JS函數(shù)自動執(zhí)行常用三種方法，下面為大家詳細介紹下JS取request值以及自動執(zhí)行使用,需要的朋友可以參考下2014-02-02