5月iOS設備性能榜：M1 M2依舊是榜單前五
和上個月一樣，沒有新品發布的iOS設備性能榜的上榜設備并沒有什么更替，僅僅只有跑分變化而產生的排名變動，剛剛開始的蘋果WWDC2023，推出的產品也依舊是新款Mac Pro、新款Mac Stu
大家好，我是 CUGGZ。
JavaScript 為我們提供了很多操作符，用于操作表達式。下面就來盤點一下 JavaScript 中那些強大的操作符！
操作符可以根據他們期待的操作符個數來分類，多數的JavaScript操作符都是二元操作符，二元操作符可以將兩個表達式合成一個更復雜的表達式。JavaScript也支持一元操作符，這些操作符可以將一個表達式轉化為另一個更復雜的表達式。同時，JavaScript中也有一個三元操作符，就是條件操作符（?:），它用于將三個表達式組成一個表達式。下面就先來看看一元操作符。
一元操作符具有以下特點：
遞增操作符顧名思義就是遞增其操作數，遞減操作符就是遞減其操作數。它們都有兩個版本：
簡單看兩個例子：
// 前置遞增操作符：let num1 = 1, num2 = 2;console.log(++num1 + num2) // 4// 后置遞增操作符：let num1 = 1, num2 = 2;console.log(num1++ + num2) // 3可以看到，兩種類型的結果是不一樣的，原因就在于后置遞增遞減操作是在包含它們的語句被求值之后才執行的。
這四個操作符可以作用于任何類型的數據。對于這些類型，JavaScript會將他們轉化為數值，再在這個數值上進行加一或減一操作。如果不能轉化為一個數字，那么遞增或遞減的結果就是NaN：
let str = "hello";console.log(str++) // NaN遞增和遞減操作符主要用于for循環中控制計算器遞增或遞減。
加和減操作符既是一元操作符，也是二元操作符。這里我們先來看一元加和減操作符。
一元加操作符會將其操作數轉化為數值，并返回轉化后的值。需要注意：
let a = -1;let b = "hello";let c = BigInt;console.log(+a) // -1console.log(+b) // NaNconsole.log(+c) // NaN一元減操作符和一元加操作符類似，會先將操作數轉化為數值，然后會改變結果的符號：
let a = -1;let b = 2;console.log(-a) // 1console.log(-b) // -2一元加和減操作符主要用于基本的算術運算，也可以用于數據類型的轉換，將不同類型的數據轉化為數字類型，像Number()方法一樣。
現代計算機中數據都是以二進制的形式存儲的，即0、1兩種狀態，計算機對二進制數據進行的運算加減乘除等都是叫位運算，即將符號位共同參與運算的運算。
JavaScript中所有的數字都是以IEEE 754 64位格式存儲，但是位操作并不直接應用到64位，而是先將值轉化為32位整數，再進行位操作。之后再把運算結果轉化為64位，所以我們只需要考慮32位整數即可。位操作是在數值的底層完成的，所以運算速度會相對于其他運算符快很多。
常見的位運算有以下幾種：
運算符 | 描述 | 運算規則 |
&` | 與 | 兩個位都為1時，結果才為1 |
| | 或 | 兩個位都為0時，結果才為0 |
^ | 異或 | 兩個位相同為0，相異為1 |
~ | 取反 | 0變1，1變0 |
<< | 左移 | 各二進制位全部左移若干位，高位丟棄，低位補0 |
>> | 右移 | 各二進制位全部右移若干位，正數左補0，負數左補1，右邊丟棄 |
在說這些操作符之前，先來看幾個相關的概念。計算機中的有符號數有三種表示方法，即原碼、反碼和補碼。三種表示方法均有符號位和數值位兩部分，符號位都是用0表示“正”，用1表示“負”，而數值位，三種表示方法各不相同。
原碼就是一個數的二進制數。例如：10的原碼為0000 1010
例如，-10的反碼如下：
原碼：1000 1010反碼：1111 0101例如，-10的補碼如下：
原碼：1000 1010反碼：1111 0101補碼：1111 0110按位與操作符（&）會對參加運算的兩個數據按二進制位進行與運算，即兩位同時為 1 時，結果才為1，否則結果為0。運算規則如下：
0 & 0 = 0 0 & 1 = 0 1 & 0 = 0 1 & 1 = 1例如，3 & 5 的運算結果如下：
0000 0011 0000 0101 = 0000 0001因此 3 & 5 的值為 1。需要注意：負數按補碼形式參加按位與運算。
用途：
只要根據最未位是0還是1來決定，為0就是偶數，為1就是奇數。因此可以用if ((i & 1) === 0)代替if (i % 2 === 0)來判斷a是不是偶數。
如果想將一個單元清零，即使其全部二進制位為0，只要與一個各位都為零的數值相與，結果為零。
按位或操作符（|）會對參加運算的兩個對象按二進制位進行或運算，即參加運算的兩個對象只要有一個為1，其值為1。運算規則如下：
0 | 0 = 00 | 1 = 1 1 | 0 = 1 1 | 1 = 1例如，3 | 5 的運算結果如下：
0000 0011 0000 0101 = 0000 0111因此，3 | 5的值為7。需要注意：負數按補碼形式參加按位或運算。
按位非操作符 (~)會對參加運算的一個數據按二進制進行取反運算。即將0變成1，1變成0。運算規則如下：
~ 1 = 0~ 0 = 1例如：~6 的運算結果如下：
0000 0110= 1111 1001在計算機中，正數用原碼表示，負數使用補碼存儲，首先看最高位，最高位1表示負數，0表示正數。此計算機二進制碼為負數，最高位為符號位。
當按位取反為負數時，就直接取其補碼，變為十進制：
0000 0110 = 1111 1001反碼：1000 0110補碼：1000 0111因此，~6的值為-7。按位非的操作結果實際上是對數值進行取反并減1，
按位異或運算符（^）會對參加運算的兩個數據按二進制位進行“異或”運算，即如果兩個相應位相同則為0，相異則為1。運算規則如下：
0 ^ 0 = 0 0 ^ 1 = 1 1 ^ 0 = 1 1 ^ 1 = 0例如， 3 ^ 5的運算結果如下：
0000 0011 0000 0101 = 0000 0110因此，3^5的值為6。
異或運算具有以下性質:
左移操作符（<<）會將運算對象的各二進制位全部左移若干位，左邊的二進制位丟棄，右邊補0。若左移時舍棄的高位不包含1，則每左移一位，相當于該數乘以2。
例如：
a = 1010 1110a = a << 2這里將a的二進制位左移2位、右補0，即得 a = 1011 1000。
需要注意，左移會保留他所操作數值的符號。比如，將-2左移5位，會得到-64，而不是64。
有符號右移操作符（>>）會將數值的32位全部右移若干位（同時會保留正負號）。正數左補0，負數左補1，右邊丟棄。操作數每右移一位，相當于該數除以2。
例如：a = a >>2 就是將a的二進制位右移2位，左補0 或者 左補1得看被移數是正還是負。
無符號右移操作符（>>>）會將數值的32位全部右移。對于正數，有符號右移操作符和無符號右移操作符的結果是一樣的。對于負數的操作，兩者就會有較大的差異。
無符號右移操作符將負數的二進制表示當成正數的二進制表示來處理。所以，對負數進行無符號右移操作之后就會變的特別大。
這里說的加法操作符就是二元的加操作符了。二元加操作符用于計算數值操作或者拼接字符串操作。
1 + 1 // 2"1" + "2" // "12""hello" + "world" // "helloworld"在進行加操作時，如果兩個操作數都是數值或者都是字符串，那么執行結果就分別是計算出來的數值和拼接好的字符串。除此之外，執行結果都取決于類型轉化的結果：它會優先進行字符串拼接，只有操作數是字符串或者是可以轉化為字符串的對象，另一個操作數也會被轉化為字符串，并執行拼接操作。只有任何操作數都不是字符串時才會執行加法操作。
1 + 2 // 3"1" + "2" // "12""1" + 2 // "12"1 + {} // "1[object Object]"true + false // 1 布爾值會先轉為數字，再進行運算1 + null // 1 null會轉化為0，再進行計算1 + undefined // NaN undefined轉化為數字是NaN需要注意加操作的順序：
let a = 1;let b = 2;let c = "hello" + a + b; // "hello12"這里，由于每次加法操作都是獨立完成的，第一次是字符串hello和數字a做加法操作，得到的結果是"hello1"，第二次加法操作仍然是一個字符串加一個數字，所以最終結果是一個字符串。如果想讓a和b兩個數字相加，就需要加上括號。
除此之外，還需要注意以下特殊情況：
減法操作和加法操作符類似， 但是減法操作符只能用于數值的計算，不能用于字符串的拼接。當進行減法操作時，如果兩個操作數都是數值，就會直接進行減法操作，如果有一個操作數是非數值，就會將其轉化為數值，再進行減法操作。如果轉化結果為NaN，則運算結果也是NaN。
3 - 1 // 23 - true // 23 - "" // 33 - null // 3NaN - 1 // NaN需要注意以下特殊情況：
乘法操作符用于計算兩個數的乘積。如果兩個操作數都是數值，則會執行常規的乘法運算。如果不是數值，會將其轉化為數值，在進行乘法操作。
需要注意以下特殊情況：
除法操作符用于計算一個操作數除以第二個操作數的商。如果兩個操作數都是數值，則會執行常規的除法運算。如果不是數值，會將其轉化為數值，在進行除法操作。
需要注意以下特殊情況：
取余操作符用于計算一個數除以第二個數的余數。計算規則和上述運算符類似。
需要注意以下特殊情況：
在ECMAScript 7中新增了指數操作符（**），它的計算效果是Math.pow()是一樣的：
Math.pow(2, 10); // 10242 ** 10; // 1024指數運算符和上面的加減乘除運算符都有對應的賦值操作運算符：
let a = 2;a **= 10;console.log(a); // 1024let a = 1;let b = 2;let c = 3;let d = 4;a += 1; // 2b -= 2; // 0c *= 3; // 9d /= 4; // 1在開發時，布爾操作符是很有用的，可以精簡很多代碼，干掉很多多余的id-else語句，下面來看看常見的三種布爾操作符。
邏輯非操作符可以用于JavaScript中的任何值，這個操作符使用返回布爾值。邏輯非操作符首先會將操作數轉化為布爾值，然后在對其取反。
邏輯非操作規則如下：
邏輯非操作符也可以用于將任何值轉化為布爾值，同時使用兩個!，相當于調用了Boolean()方法：
!!"blue" // true!!0; // false!!NaN // false!!"" // false!!12345 // true邏輯與操作符的兩個操作數都為真時，最終結果才會返回真。該運算符可以用于任何類型的數據。如果有操作數不是布爾值，則結果并一定會返回布爾值，會遵循以下規則：
根據第二條規則，我們可以對我們項目代碼中的代碼進行優化：
if(data) { setData(data);}// 改寫后：data && setData(data);這里當data為真時，也就是存在時，才會執行setData方法，代碼就精簡了很多。
邏輯與操作符是一種短路操作符，只要第一個操作數為false，就不會繼續執行運算符后面的表達式，直接返回false。上面的data如果是不存在的，就會直接發生短路，不會繼續執行后面的方法。
邏輯或操作符和邏輯與操作符類似，不過只要兩個操作數中的一個為真，最終的結果就為真。該運算符可以用于任何類型的數據。如果有操作數不是布爾值，則結果并一定會返回布爾值，會遵循以下規則：
邏輯或操作符也是具有短路特性，如果第一個操作數為真，那么第二個操作數就不需要在進行判斷了，會直接返回true。
可以利用這個特性給變量設置默認值：
let datas = data || {};這里，如果data不存在，就會將datas賦值為第二個操作數（默認值）。
相等操作符包括四種：
JavaScript中的等于用兩個等號（==）表示，如果兩個操作數相等，那么就返回true。不等于和等于相反。在進行比較時，兩個操作數都會進行強制類型轉換，在確實是否相等。其判斷規則如下：
1 == '1' ↓1 == 1'1' == true ↓'1' == 1 ↓ 1 == 1'1' == { name: 'js' } ↓'1' == '[object Object]'其流程圖如下：
需要注意，如果其中一個操作數是NaN，相等運算符會返回false，不相等運算符會返回true。
對于不等于運算符（!=），只有在強制類型轉化后不相等才會返回true。
對于全等運算符（===），只有當兩個操作數的數據類型和值都相等時，才會返回true。它并不會進行數據類型的轉化。
對于不全等運算符（!==），只有兩個操作數在不進行類型轉化的情況下是不相等的，才會返回true。
在平時的開發中，建議使用全等和不全等在做比較，這樣會更加嚴謹，避免出現意料之外的結果。
關系操作符包括四種：
這幾個操作符都會返回一個布爾值，他們操作時會遵循以下規則：
最后這一部分的一些操作符在平時的開發中就很實用了，下面來看看它們的用法吧。
擴展操作符(Spread operator)可以用來擴展一個數組對象和字符串。它用三個點（…）表示，可以將可迭代對象轉為用逗號分隔的參數序列。
const a = [1, 2, 3], b = [4, 5, 6];const c = [...a] // [1, 2, 3]const d = [...a, ...b] // [1, 2, 3, 4, 5, 6]const e = [...a, 4, 5] // [1, 2, 3, 4, 5]const list = document.getElementsByTagName('a');const arr = [..list];const obj1 = { a: 1, b: 2 };const obj2 = { c: 3, d: 4 };const merged = { ...obj1, ...obj2 }; // { a: 1, b: 2, c: 3, d: 4 }需要注意，如果合并時的多個對象有相同屬性，則后面的對象的會覆蓋前面對象的屬性。
const str = "hello";[...str] // ["h", "e", "l", "l", "o"]const f = (foo, bar) => {}const a = [1, 2]f(...a)const numbers = [1, 2, 3, 4, 5]const sum = (a, b, c, d, e) => a + b + c + d + econst sum = sum(...numbers)具有 Iterator 接口的對象 Map 和 Set 結構，Generator 函數，可以使用展開操作符:
const s = new Set();s.add(1);s.add(2);const arr = [...s]// [1,2]function * gen() { yield 1; yield 2; yield 3;}const arr = [...gen()] // 1，2，3如果是map，會把每個key 和 value 轉成一個數組：
const m = new Map();m.set(1,1)m.set(2,2)const arr = [...m] // [[1,1],[2,2]]注意 ，對象不是一個Iterator對象。
這里的條件運算符實際上就是我們常說的三元表達式?？匆粋€例子：
let res = num1 > num2 ? num1 : num2;這里，將num1和num2中的最大值賦值給了res。
使用條件表達式可以代替很多if-else，使得代碼很簡潔。在React的項目中，我個人就經常使用條件操作符來做組件的條件渲染。當然如果判斷的層數過多，感覺代碼就有些難讀懂了。（React-Router源碼中就有嵌套了六七層條件操作符的地方，很難理解...）
其實賦值操作符有很多種，包括簡單的賦值操作符（=），以及一些復合賦值操作符：
這些僅僅是他們對應的簡寫形式，并不會產生其他影響。
in操作符可以用來判斷一個屬性是否屬于一個對象，它的返回值是一個布爾值：
const author = { name: "CUGGZ", age: 18}"height" in author; // false"age" in author; // true還可以用來判斷一個屬性是否屬于對象原型鏈的一部分：
let arr = ["hello", "jue", "jin"];"length" in arr; // truedelete 操作符用于刪除對象的某個屬性或者數組元素。對于引用類型的值，它也是刪除對象屬性的本身，不會刪除屬性指向的對象。
const o = {};const a = { x: 10 };o.a = a;delete o.a; // o.a屬性被刪除console.log(o.a); // undefinedconsole.log(a.x); // 10, 因為{ x: 10 } 對象依然被 a 引用，所以不會被回收需要注意：
instanceof運算符用來判斷一個構造函數的prototype屬性所指向的對象是否存在另外一個要檢測對象的原型鏈上。
console.log(2 instanceof Number); // falseconsole.log(true instanceof Boolean); // false console.log('str' instanceof String); // false console.log([] instanceof Array); // trueconsole.log(function(){} instanceof Function); // trueconsole.log({} instanceof Object); // true可以看到，instanceof只能正確判斷引用數據類型，而不能判斷基本數據類型。instanceof運算符可以用來測試一個對象在其原型鏈中是否存在一個構造函數的 prototype 屬性。
可以簡單來實現一下 instanceof 操作符：
function myInstanceof(left, right) { // 獲取對象的原型 let proto = Object.getPrototypeOf(left) // 獲取構造函數的 prototype 對象 let prototype = right.prototype; // 判斷構造函數的 prototype 對象是否在對象的原型鏈上 while (true) { if (!proto) return false; if (proto === prototype) return true; // 如果沒有找到，就繼續從其原型上找，Object.getPrototypeOf方法用來獲取指定對象的原型 proto = Object.getPrototypeOf(proto); }}typeof是一元運算符，它的返回值是一個字符串，它是操作數的類型，JavaScript常見數據對應的類型如下：
x | typeof |
undefined | undefined |
null | object |
true或false | boolean |
數值或NaN | number |
BigInt | bigInt |
字符串 | string |
symbol | symbol |
函數 | function |
非函數對象 | object |
typeof 2 // numbertypeof true // booleantypeof 'str' // stringtypeof [] // object typeof function(){} // functiontypeof {} // objecttypeof undefined // undefinedtypeof null // object那這里為什么 typeof null 的結果是Object呢？
在 JavaScript 第一個版本中，所有值都存儲在 32 位的單元中，每個單元包含一個小的 類型標簽(1-3 bits) 以及當前要存儲值的真實數據。類型標簽存儲在每個單元的低位中，共有五種數據類型：
000: object - 當前存儲的數據指向一個對象。 1: int - 當前存儲的數據是一個 31 位的有符號整數。010: double - 當前存儲的數據指向一個雙精度的浮點數。100: string - 當前存儲的數據指向一個字符串。110: boolean - 當前存儲的數據是布爾值。如果最低位是 1，則類型標簽標志位的長度只有一位；如果最低位是 0，則類型標簽標志位的長度占三位，為存儲其他四種數據類型提供了額外兩個 bit 的長度。
有兩種特殊數據類型：
那也就是說null的類型標簽也是000，和Object的類型標簽一樣，所以會被判定為Object。
在編寫代碼時，如果某個屬性不為 null 和 undefined，那么就獲取該屬性，如果該屬性為 null 或 undefined，則取一個默認值：
const name = dogName ? dogName : 'default';可以通過 || 來簡化：
const name = dogName || 'default';但是 || 的寫法存在一定的缺陷，當 dogName 為 0 或 false 的時候也會走到 default 的邏輯。所以 ES2020 引入了 ?? 運算符。只有 ?? 左邊為 null 或 undefined時才返回右邊的值：
const dogName = false; const name = dogName ?? 'default'; // name = false;在開發過程中，我們可能需要獲取深層次屬性，例如 system.user.addr.province.name。但在獲取 name 這個屬性前需要一步步的判斷前面的屬性是否存在，否則并會報錯：
const name = (system && system.user && system.user.addr && system.user.addr.province && system.user.addr.province.name) || 'default';為了簡化上述過程，ES2020 引入了「鏈判斷運算符」?.，可選鏈操作符( ?. )允許讀取位于連接對象鏈深處的屬性的值，而不必明確驗證鏈中的每個引用是否有效。?. 操作符的功能類似于 . 鏈式操作符，不同之處在于，在引用為null 或 undefined 的情況下不會引起錯誤，該表達式短路返回值是 undefined。與函數調用一起使用時，如果給定的函數不存在，則返回 undefined。
const name = system?.user?.addr?.province?.name || 'default';當嘗試訪問可能不存在的對象屬性時，可選鏈操作符將會使表達式更短、更簡明。在探索一個對象的內容時，如果不能確定哪些屬性必定存在，可選鏈操作符也是很有幫助的。
可選鏈有以下三種形式：
a?.[x]// 等同于a == null ? undefined : a[x]a?.b()// 等同于a == null ? undefined : a.b()a?.()// 等同于a == null ? undefined : a()逗號操作符也沒啥好說的，當同時聲明多個變量時會用到：
let a = 1, b = 2, c = 3;還有一種使用場景就是有多個循環變量的 for 循環中：
for(let i = 0, j = 10; i < j; i++, j--){ console.log(i + j);}void 是一元運算符，它可以出現在任意類型的操作數之前執行操作數，會忽略操作數的返回值，返回一個 undefined。void 常用于 HTML 腳本中執行 JavaScript 表達式，但不需要返回表達式的計算結果。比如對于鏈接標簽，我們并不想讓它發生跳轉，就可以設置href="javascript:void(0)。
在下面代碼中，使用 void 運算符讓表達式返回 undefined：
let a = b = c = 2; // 定義并初始化變量的值d = void (a -= (b *= (c += 5))); // 執行void運算符，并把返回值賦予變量dconsole.log(a); // -12console.log(b); // 14console.log(c); // 7console.log(d); // undefined由于 void 運算符的優先級比較高，高于普通運算符的優先級，所以在使用時應該使用小括號明確 void 運算符操作的操作數，避免引發錯誤。
本文鏈接：http://m.www897cc.com/showinfo-26-79454-0.html這些強大的 JS 操作符，你都知道嗎?
聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。郵件：2376512515@qq.com
Copyright ? 2016-2023 天津谷騏科技有限公司 版權所有 sitemap.xml
違法及侵權請聯系：2376512515@qq.com 津ICP備18001702號
津公網安備 12010102000574號