JS中的運算符簡介

在JS中,運算符主要是用以連接簡單表達式,組成復雜表達式,比如下面就是一個簡單的加號運算符組成的表達式;
a + b
運算符有很多,但是可以大致的分為以下幾個大類:
算術運算符、賦值運算符、比較運算符、布爾運算符、位運算符,以及一些諸如括號,typeof之類的有特定功能的運算符,下面就對這些運算符進行一些總結。

一、算術運算符

  • 算術運算符有如下幾種:
    1.加號運算符:+,比如:1 + 2;

    加號

    2.減號運算符:-,比如1 - 2;
    減號

    3.乘號運算符:*,比如1 * 2;
    乘號

    4.除號運算符:/,比如1 / 2;
    除號

    5.求余運算符(求兩個值相除得出的余數):%,比如3 % 4;
    求余

    6.自增與自減:自增:++自減:---,指某個變量加1后賦值給自身或某個變量減1后賦值給自身;
    自增與自減

    7.求負運算符:-,例如:-1;
    求負

    8.數值運算符:+,例如:+1;
    數值

  • +運算符會根據數據類型的不同而有不同的含義:
    1.數字與字符串相加時,會把數字轉化成字符串后再做字符串的拼接:


    2.字符串與字符串相加時,會做字符串拼接:

    3.只有一個參數的時候,會將其轉化為Number類型,不能轉化為數字則轉化為NaN(NaN也是Number類型):

    PS:這種情況不單單+運算符會有,求負運算符-也會有:

    4.當運算參數中有對象時,會先調用對象的valueOf()方法,如果valueOf(),沒有值,則調用toString()方法

  • +運算符以外的運算符計算兩個值之間的結果時,如果有一方不是數字,則會調用Number()方法對其進行數字轉換,若是不能轉換為數字的類型,則轉換為NaN,并得出NaN;

  • 自增與自減之間需要注意的地方;
    1.自增自減需要的是一個變量,如果直接使用數字進行計算會出錯:


    2.表達式放左邊和放右邊的區別(a++++a的區別),自減運算類似:
    'a++'會在自增后輸出自增前的數值,++a輸出自增后的數值:
    a++

    ++a

二、賦值運算符

  • 賦值運算符有如下幾種
    1.普通賦值:=,如:a = 1;
    2.加法運算后賦值:+=,如:a += 1 → a = a + 1;
    3.減法運算后賦值:-=,如:a -= 1 → a = a - 1;
    4.乘法運算后賦值:*=,如:a *= 1 → a = a * 1;
    5.除法運算后賦值:/=,如:a /= 1 → a = a / 1;
    6.求余運算后賦值:%=,如: a %= 1 → a = a % 1;
    7.轉換二進制再向右位移后賦值:>>=,如下圖:

    8.轉換二進制再向左位移后賦值:<<=,如下圖:

    9.做與運算后賦值:&=,與運算方法請看下面的位運算符;
    10.做或運算后賦值:|=,或運算方法請看下面的位運算符;
    11.做異或運算后賦值:^=,異或運算方法請看下面的為運算符;

三、位運算符(因為不常用,只做運算方法的介紹)

  • 為運算符有以下幾種
    或運算:|,表示兩個二進制位中有一個為1,則結果為1,否則為0。
    與運算:&,表示兩個二進制位都為1,則結果為1,否則為0。
    否運算:,表示將一個二進制位變成相反值。
    異或運算:?,表示兩個二進制位中有且僅有一個為1時,結果為1,否則為0。
    左移運算:<<,表示某個數的二進制表示向右位移兩位;
    右移運算:>>,表示某個數的二進制表示向左位移兩位;

  • 關于十進制轉化二進制
    1.二進制介紹:
    與十進制逢十進一不同,二進制是逢二進一,也就是說十進制中的2,在二進制中表示為000000010,十進制的1則為000000001;
    2.JS中十進制與二進制相互轉換的方法:
    十進制轉換二進制(調用toString()方法):

    十進制轉換二進制

    二進制轉換十進制(調用parseInt()方法):
    二進制轉換十進制

  • 關于位運算符的計算方式
    以或運算為例(1|2):


    圖解

四、比較運算符

  • 比較運算符簡介
    比較運算符用于兩個值之間的比較,然后返回一個布爾值(true或者false)

  • 比較運算符有如下幾種
    1.相等: ==
    2.嚴格相等: ===
    3.不相等: !=
    4.嚴格不相等: !==
    5.小于: <
    6.小于或等于: <=
    7.大于: >
    8.大于或等于: >=

  • =====之間的區別
    1.兩個等于號的==運算符進行值的比較之前,會將兩個值轉化成相同的數據類型再進行比較:


    2.三個等于號的===運算符直接進行比較,不進行數據類型間的轉換:

    3.!=!==運算符的比較與上面類似;

五、布爾運算符

  • 布爾運算符簡介
    1.布爾運算符中的&&和||用于對兩個值轉換成布爾類型進行判斷,然后輸出一個值;
    2.!運算符用于對值的布爾值類型進行取反,例如:!1輸出為false

  • 布爾運算符有如下幾個
    1.取反:!,true轉換為false,false轉換為true;
    2.且運算:&&,只要有一個為false則為false;
    3.或運算:||,只要有一個為true則結果為true;

  • 且運算&&與或運算||的'斷路'機制
    1.&&且運算符在遇到第一個值為false時,不會對第二個值進行判斷,直接輸出第一個值,兩者都為true或第一個值為true時輸出第二個值:


    2.||或運算符在遇到第一個值為true時,不對第二個值進行判斷,直接輸出第一個值,兩者都為false或第一個值為false時輸出第二個值:

  • 三元條件運算符
    1.用處:用來做條件判斷,如果對則輸出true時的命令,錯誤則輸出false是的命令,格式如下:
    condition? true case : false case;
    2.例子:

六、其它運算符

  • typeof 運算符:
    1.用處:用于判斷一個值的數據類型:如下



    2.注意,typeof的優先級非常高,比加減乘除都高,所以如下運算中,會先計算typeof 2的結果,再加上3:


  • 小括號運算符
    用處有兩個:
    1.放在函數后面表示調用該函數:



    2.包裹表達式用于表明被包裹的表達式進行優先計算:


  • void運算符
    1.用處:用于接收一個表達式,然后輸出undefined,使用該運算符輸出undefined的原因是防止在低版本的瀏覽器中undefined被覆蓋


    2.常用于做判斷的語句中:

  • 逗號運算符
    1.用處:用處接受兩個表達式,然后返回后一個表達式的值:


另外:關于運算符的優先級以及結合性請參考MDN文檔

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 229,460評論 6 538
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,067評論 3 423
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 177,467評論 0 382
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,468評論 1 316
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,184評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,582評論 1 325
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,616評論 3 444
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,794評論 0 289
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,343評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,096評論 3 356
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,291評論 1 371
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,863評論 5 362
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,513評論 3 348
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,941評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,190評論 1 291
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,026評論 3 396
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,253評論 2 375

推薦閱讀更多精彩內容