JavaScript 再入門(その8) 論理演算子

論理演算子

JavaScript には、|| (OR:論理和)、&& (AND:論理積)、! (NOT:論理否定)、?? (Null合体) ^*ES2020 の 4 つの論理演算子があります。

|| (OR:論理和)

if 文の中で条件のいずれかが真(true)であるかを確認する。

let x = 9 ;
if ( x < 10 || x > 20 ) {
	console.log( 'TRUE' ) ;
} else {
	console.log( 'FALSE' ) ;
}
// TRUE

JavaScript 特有の || (OR:論理和) の使い方。

result = value1 || value2 || value3 ;

value1 、value2 、value3 を Boolean に変換して最初の true を探します。

value1 が true であれば value1 を result へ渡して停止します。
value2 が true であれば value2 を result へ渡して停止します。
value1 と value2 が false であれば value3 を result へ渡します。

falsy (偽値)

JavaScript の Boolean への変換例 falsy (偽値)

console.log( Boolean(0) ) ; // false ***
console.log( Boolean(1) ) ; // true
console.log( Boolean(2) ) ; // true
console.log( Boolean(3) ) ; // true
console.log( Boolean('') ) ; // false ***
console.log( Boolean('A') ) ; // true
console.log( Boolean('B') ) ; // true
console.log( Boolean(null) ) ; // false ***
console.log( Boolean( undefined ) ) ; // false ***
console.log( Boolean( NaN ) ) ; // false ***

0 (数値型)、” (文字列型空文字)、 null、undefined 、NaN のときに false となります。
このように false 以外にも false と判定される値をのことを falsy (偽値)といいます。
この falsy を利用して、値が設定されていないときのみ初期値を設定する等のロジックに使われます。

function ini(val) {
	let ret = val || 'Initial value' ; // val が false なら 'Initial value' を返す。
	return ret ;
}
console.log( ini( null ) ); // Initial value
console.log( ini( undefined ) ); // Initial value
console.log( ini( '' ) ); // Initial value
console.log( ini( 'Hello World' ) ); // Hello World
console.log( ini( 0 ) ); // Initial value
console.log( ini( 10 ) ); // 10

?? (Null合体)

?? (Null合体)^*ES2020 を使うと null と undefined のみが false となるので結果が変わります。

function ini(val) {
	let ret = val ?? 'Initial value' ; // val が null か undefined なら 'Initial value' を返す。
	return ret ;
}
console.log( ini( null ) ); // Initial value
console.log( ini( undefined ) ); // Initial value
console.log( ini( '' ) ); // '' 空文字が返る ***
console.log( ini( 'Hello World' ) ); // Hello World
console.log( ini( 0 ) ); // 0 ***
console.log( ini( 10 ) ); // 10

” (空文字) と 0(数値型)がそのまま返ります。

&& (AND:論理積)

if 文の中で条件のいずれもが真(true)であるかを確認する。

let x = 11 ;
if ( x > 10 && x < 20 ) {
	console.log( 'TRUE' ) ;
} else {
	console.log( 'FALSE' ) ;
}
// TRUE

JavaScript 特有の && (AND:論理積) の使い方。

result = value1 && value2 && value3 ;

value1 、value2 、value3 を Boolean に変換して最初の false を探します。

value1 が false であれば value1 を result へ渡して停止します。
value2 が false であれば value2 を result へ渡して停止します。
value1 と value2 が false であれば value3 を result へ渡します。

function ini(val) {
	let ret = val && 'Initial value' ; // val が true なら 'Initial value' を返す。
	return ret ;
}
console.log( ini( null ) ); // null
console.log( ini( undefined ) ); // undefined
console.log( ini( '' ) ); // '' 空文字
console.log( ini( 'Hello World' ) ); // Initial value ***
console.log( ini( 0 ) ); // 0
console.log( ini( 10 ) ); // Initial value

! (NOT:論理否定)

true を false に false を true に反転します。

function ini(val) {
	let ret = !val ;
	return ret ;
}
console.log( ini( null ) ); // true
console.log( ini( undefined ) ); // true
console.log( ini( '' ) ); // true
console.log( ini( 'Hello World' ) ); // false
console.log( ini( 0 ) ); // true
console.log( ini( 10 ) ); // false