[Javascript]タイプ変換と迅速な評価

26616 ワード
frontend js テキストリンク

第9章タイプ変換と迅速評価


ソースモダンJavaScript Deep Dive.

タイプ変換


開発者が望む値のタイプ変換を明示的なタイプ変換またはタイプ鋳造と呼ぶ.開発者は意図的ではないが,JavaScriptエンジンによるタイプ変換をデフォルトタイプ変換(Implicit Coertion)またはタイプ強制変換(Type Coertion)と呼ぶ.ただし、タイプ変換では既存の元の値を直接変更することはできません.
vafr num = 1;
var str = num + '';

console.log(typeof str, str); //string, '1'
console.log(typeof num, num); //number, 1

隠しタイプ変換


JavaScriptエンジンは、式を評価するときに開発者の意図がなくても、コードのコンテキストを通じて黙々とタイプを強制的に変換することができます.
console.log('1' + 2) //12
console.log(2 * '1') //2
console.log(!0) //true

  • 数値タイプに変換
    +'' //0
+'0' //0
+'string' //NaN
+true //1
+false //0
+null //0
+undefined //NaN
+Symbol() //TypeError
+{} //NaN
+[] //0
+[1, 2] //NaN,
+(function() {}) //NaN

  • 文字タイプに変換
    1 + '' //'1'
-0 + '' //'0'
NaN + '' //'NaN'
Infinity + '' //'Infinity'
-Infinity + '' //'-Infinity'
true + '' //'true'
false + '' //'false'
null + '' //'null'
undefined + '' //'undefined'
(Symbol()) + '' //TypeError
({}) + '' //"[object object]"
Math + '' //"[object Math]"
[] + '' //
[1, 2] + '' //'1,2'
(function() {}) + '' //'function(){}'
Array + '' //"function Array() {[native code]}"

  • booleanタイプに変換
    if('') console.log('1'); //
if(true) console.log('2'); //2
if(0) console.log('3'); //
if('string') console.log('4'); //4
if(null) console.log('5'); //
    JavaScriptエンジンは、ブール以外のタイプの値をTruthy値とFalsy値に分けます.
    false、undefined、null、0、-0、NaN、""はFalsy値で区切られます.

    • 明示的なタイプ変換


  • 数値タイプに変換
    Number('1') //1
Numbrt('-1') //-1
Number('1.1') //1.1
Number(true) //1
Number('str') //NaN, 숫자인 문자열만 가능

parseInt('1') //1
parseInt('-1') //-1
parseInt('1.1') //1
parseFloat('1.1') //1.1
parseInt(true) //NaN, 문자열만 가능

+'1' //1
+'-1' //-1
+'1.1' //1.1
+true //1
+false //0

'1' * 1 //1
'-1' * 1 //-1
'1.1' * 1 //1.1
true * 1 //1
false * 1 //0

  • 文字列タイプに変換
    String(1) //'1'
String(NaN) //'NaN'
String(Infinity) //'Infinity'
String(true) //'true'

(1).toString() //'1'
(NaN).toString() //'NaN'
(Infinity).toString() //'Infinity'
(true).toString() //'true'

1 + '' //'1'
NaN + '' //'NaN'
Infinity + '' //'Infinity'
true + '' //'true'

  • booleanタイプに変換
    Boolean('x') //true
Boolean('false') //true
Boolean('') //false
Boolean(0) //flase
Boolean(1) //true
Boolean(NaN) //false
Boolean(Infinity) //true
Boolean(-Infinity) //true
Boolean(null) //false
Boolean(undefined) //false
Boolean({}) //true
Boolean([]) //true

!!'x' //true
!!'' //false
!!'false' //true
!!0 //false
!!1 //true
!!NaN //false
!!undefined //false
!!null //false
!!Infinity //true
!!{} //true
!![] //true

    • 迅速な評価


    ショートカット評価とは、評価式の場合、評価結果が確定した場合、残りの評価過程を省略することである.論理と論理積(&&)の結果値は、必ずしもブール型ではない可能性があります.論理積と論理積の結果値は2つの被演算子で片側と推定される.
    'Cat' && 'Dog' //'Dog''Cat' || 'Dog' //'Cat'
    nullに割り当てられたオブジェクトのpropertyにアクセスすると、タイプエラーが発生します.しかし,このことは評価時間を短縮することによって実現できる.
    var element = null;console.log(element.value); //TypeErrorconsole.log(element && element.value); //null;
    また、割り当てられていない関数のパラメータ値のpropertyを参照する場合は、ショートカット評価を使用してエラーを防止できます.
    function foo(str) {	return str.length;}console.log(foo()); //Type Errorfunction foo(str) {	var result = str || '';	return result.length;}console.log(foo()); //0

    光学フィルタ演算子


    傍観者チェニン演算子は?です.左皇の被演算子がnullまたはundefinedの場合、undefinedが返されます.そうでない場合は、右項のpropertyが参照されます.
    var element = null;console.log(element?.value) //undefined
    論理演算子の論理乗(&&)として、左がFalsy値の場合、左の値が返されます.ただし、Falsy値で計算した0または「」はオブジェクトとして計算できます.
    var str = 'aaa';var length = str && str.length;console.log(length); //''var length = str?.length;console.log(length) //0

    空の連結演算子


    null連結演算子?左の被演算子がnullまたはundefinedの場合、右の被演算子が返され、そうでない場合、左の被演算子が返されます.
    var str = null ?? 'string';console.log(str); //string
    論理演算子論理和(|)左がFalsy値の場合、右の被演算子が返されます.ただし、Falsy値で計算した0または「」はオブジェクトとして計算できます.
    var str = '' || 'string';console.log(str) //'string';str = '' ?? 'string';console.log(str) //''
    アクションツールキットCLIで独自のGitHubアクションを生成する
    60日目コンピュータエンジニアリングの基礎