Nice to Meet You

I’m Hannah, a Taiwanese 30 years old front end developer.
Learning and sharing always makes me happy, and I am interested in the new things including coding and design.

Skills

  • HTML, RWD
  • JS, ES6, AngularJs, VueJs, jQuery
  • CSS, SASS, SMACSS/MVCSS
  • PHP, Wordpress
  • Git, Gulp, webpack

Experience

  • 8+ years of working experience as a web developer, now is in afusion
  • Sass / css lecturer for prototype-hacker
  • Host a conference at FEDC
Contact me
#, | May 28 2018

邏輯 && || + 位元運算子 & | ^

大家看到 && ||,就想到判斷式 if(a == 0 && b == 0) 之類.本篇不會說這種的使用狀況,因為大家都耳熟能祥了。
假如你跟我一樣對於以下狀況一頭霧水並想了解,那這篇文章就適合你了

Logical operators

Bitwise operators


Logical operators 邏輯運算子

expr1 || expr2

如果 expr1 能轉換成 true 則返回 expr1,否則返回 expr2,常運用在給預設值上。也就是當 epxr1 條件成立時 (truthy),就不用去管 expr2 了.

expr1 && expr2

如果expr1 能转换成 false 则返回 expr1,否则返回 expr2。也就是 (expr1) ? expr2 : expr1
&& 稍微難懂一點,可能沒 || 這麼常用到.這邊來舉個例子

總而言之就是,當 epxr1 條件成立時 (truthy),才會去執行 expr2

他可以精簡我們的程式碼,以前要寫很多 if 判斷,現在可以一行搞定
add

自己在案子上常運用在判斷有資料再抓,因為有時候用 SPA 還沒 rendor 到資料就印出來會報錯誤

 

Bitwise operators 位元運算子

看起來跟邏輯運算子很像? 完全不一樣啊!!他是在處理二進位的事,在寫一些練習有用 (codefight) ,真的會大大減少撰寫行數.倒是平常寫前端還真的從來沒用到過.
這邊先講一個 js 十進位轉二進位跟二進位轉十進位方法

& (AND)

bit1 & bit2 : 當兩個位元都是1時,回傳1。

|(OR)

bit1 | bit2 : 其中一個位元是1時,回傳1。

^(XOR)

bit1 ^ bit2 : 當兩個位元一樣時回傳0,不一樣時回傳1。

有興趣的話可以練習一下這種題目,解答是 (m^n) & -(m^n) // 有夠難懂的解答
1