有趣的賦值邏輯運算符

寫在前面

我們在寫js邏輯的時候,不可否認的用到了很多邏輯的運算符,像||、&&這些,那麼我們基本都是在三元運算符或者if判斷裏進行使用,那麼我們其實可以在賦值的時候一樣的使用,今天我們就看看怎麼使用它來寫一些看起來比較牛逼的代碼!

規則

首先說一下他們的規則,比如我們寫一個簡單的賦值:

let name = 0 || 2 //結果:2
let name = 0 && 2 //結果:0
let name = 0||4 && false || 4 //結果:4

是不是腦子有點懵,這裏說一下規則

  • || 首先判斷左邊是true還是false,如果是true就直接取左邊的,如果是false就直接取右邊的
  • && 首先判斷左邊的是true還是false,如果是true就直接取右邊的,如果是false就直接取左邊的
  • 如果||和&&同時存在,首先計算&&其次計算||

寫個🌰

/**
		 * @param {Object} value  形參值
		 * @param {Object} callback、 形參 函數
		 */
		function fn(value, callback) {
			if (typeof value === 'undefined') value = 0;console.info(value)
			if(callback){
				callback()
			}
		}
        /**
		 * @csdnfn 作爲實參傳遞
		 */
		function csdnfn() {
			console.info("ok")
		}
		window.onload = function() {
			fn(csdnfn())
		}

這是一段很普通的代碼,寫過js的基本上都可以看的明白,我們給fn兩個參數,一個是值,一個是函數,因爲js如果你不給形參值的話,那麼他形參本身是undefined,undefined其實在布爾中是false,所以我們一般寫邏輯的時候首先判斷該值是不是傳遞了,從而進行一個業務的執行,但是如果使用賦值邏輯運算符怎麼寫呢?

改寫的🌰

/**
		 * @param {Object} value  形參值
		 * @param {Object} callback、 形參 函數
		 */
		function fn(value, callback) {
			console.info(value = value || 0) //如果vlaue爲false,直接賦值爲0
			callback && callback() //如果函數存在,直接執行右邊的
		}
        /**
		 * @csdnfn 作爲實參傳遞
		 */
		function csdnfn() {
			console.info("ok")
		}
		window.onload = function() {
			fn(csdnfn())
		}

結果:在這裏插入圖片描述

怎麼樣,是不是看起來就比較裝逼了,其實我們看大神的代碼的時候,很多的時候會這樣寫,其實好不好呢,我覺得不好,那如果我直接傳一個null過去,其實是false,但是他給我賦值爲0了,怎麼辦,只是說我們一般情況下默認不會傳一個false過去,所以纔會有這樣的寫法存在。

謝謝閱讀

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章