JavaScriptデータタイプ変換

5768 ワード
メモ
JavaScriptはダイナミックタイプの言語で、変数にはタイプ制限がなく、いつでも任意の値を与えることができます.だから、ここではデータの種類について話します.
データタイプ変換は、強制変換と暗黙変換の2つに分けられます.
1.強制変換
強制変換とは、String、Number、Booleanの3つの方法を用いて、各種の値を手動で対応する文字列、数値、ブール値に変換することです.
1.1 String
String関数は、任意の種類の値を文字列に変換することができ、具体的な変換ルールは以下の通りである.
(1)元の値の種類
  • a.文字列:変換後も元の値です.
  • b.数値:対応する文字列に変換する.
  • c.ブール値:true=>'true',false=>'false'
  • d.null:null=>'null'
  • e.undefined:undefined=>'undefined'
    String(123); // "123"
String('abc'); // "abc"
String(true); // "true"
String(undefined); // "undefined"
String(null); // "null"
    • (2)オブジェクト.Stringメソッドの内在ルールを理解するためには、丸暗記する必要はありません.具体的なルールは次の通りです.
  • は、まず、自身のtoString方法を起動し(カスタムされるかもしれない)、元のタイプの値が戻ってきたら、そのまま返した値に対してString方法を使用して戻ってきて、後のステップではない.
    const obj1 = { a: 1 };
String(obj1); // [object Object]

//    
String(obj1.toString()); // [object Object]


const obj2 = {
    toString: () => {
        return 2;
    }
}
String(obj2); // '2'
  • toString方法がオブジェクトである場合、自身(tostring方法で戻ってきたオブジェクトではなく)を呼び戻すvalueOf(同様にカスタムされることもある)方法を継続し、元のタイプの値に戻ると、返った値に対してString方法を用いて返され、後のステップではない.
    const obj1 = {
    toString: () => {
        return {};
    },
    valueOf: () => {
        return 'haha';
    },
}
String(obj1); // 'haha'

const obj2 = {
    toString: () => {
        return {
            valueOf: () => {
                return 'heihei';
            },
        };
    },
    valueOf: () => {
        return 'haha';
    },
}
String(obj2); // 'haha'
//   ，       toString     valueOf  ，        valueOf
  • もしvalueOf方法で戻ってきたのがまだ対象であれば、エラーが発生します.
    const obj1 = {
    toString: () => {
        return {};
    },
}
String(obj1); // Uncaught TypeError: Cannot convert object to primitive value
    •  
    1.2 Number
    Number関数は、任意の種類の値を数値に変換できます.具体的な変換ルールは以下の通りです.
    (1)元のタイプ
  • a.文字列.
  • 数値に変換できれば、数値を返します.
  • 数値に変換できない場合、NaNに戻る.
  • 空の文字列は0に変換されます.
  • は、文字列の先頭と拡張子のスペースを自動的にフィルタします.
    Number('123'); // 123
Number('123aaa'); // NaN
Number(''); // 0
Number(' '); // 0
Number(' 0 '); // 0
Number(' 0 0 '); // NaN
  • b.数値:直接元の値を返します.
    Number(123); // 123
Number(0); // 0
Number(0.23); // 0.23
Number(NaN); // NaN
Number(Infinity); // Infinity
Number(-Infinity); // -Infinity
  • c.ブール値:true=>1、false=>0
    Number(true); // 1
Number(false); // 0
  • d.null:null=>0
    Number(null); // 0
  • e.undefined:undefined=>NaN;
    Number(undefined); // NaN
    •  
    (2)オブジェクト.単純な規則は、単一の値を含む配列(または空の配列)でない限り、NaNに戻ります.
    Number({}); // NaN
//    
({}).valueOf(); // {}
({}).toString(); // '[object Object]'
Number('[object Object]'); // NaN

Number([]); // 0
//    
[].valueOf(); // []
[].toString(); // ''
Number(''); // 0

Number([1]); // 1    Number(['1']);
//    
[1].valueOf(); // [1]
[1].toString(); // '1'
Number('1'); // 1
    具体的な変換のルールはStringと似ていますが、toStringとvalueOfメソッドを呼び出す順番が変わります.
  • は、まずObj.valueOf方法を呼び出し、元のタイプの値を返すと、直接にリターン値に対してNumber関数を呼び出して戻る.
    const obj = {
    valueOf: () => {
        return '123';
    },
}
Number(obj); // 123
  • .valueOf方法がオブジェクトである場合、Obj.toString方法を起動し続ける.Stringメソッドが元のタイプの値を返した場合、戻り値に対してString関数を呼び出します.
    const obj1 = {
    valueOf: () => {
        return {};
    },
}
Number(obj1); // NaN
//   obj1 toString    ‘[object Object]’;

const obj2 = {
    valueOf: () => {
        return {};
    },
    toString: () => {
        return '123';
    },
}
Number(obj2); // 123
  • toString方法で戻ってきたのか、それともオブジェクトだったのか、直接エラーを報告する.
    const obj = {
    valueOf: () => {
        return {};
    },
    toString: () => {
        return {};
    },
};
Number(obj); // Uncaught TypeError: Cannot convert object to primitive value
    • 1.3 Boolean
    Boolean()関数は、任意の種類の値をブール値に変換できます.
    そのルールは比較的簡単で、以下の5つの値をfalseに変換する以外に、他のものは全部trueです.
  • undefined
  • null
  • 0(-0と+0を含む)
  • NaN
  • ''(空の文字列)
    Boolean(undefined); // false
Boolean(null); // false
Boolean(0); // false
Boolean(NaN); // false
Boolean(''); // false         

Boolean(' '); // true
     
    • 以上、強制変換について紹介しました. 
    2.暗黙的な変換
    ルールとは、どのタイプの値が期待されるかについて、対応する変換関数を呼び出します.
    2.1ブール値に変換
    JavaScriptは、if判定文、三目演算、使用などのブール値が予想される場所に遭遇しました.(非演算子)など、Boolean関数を呼び出して暗黙的に変換します.
    2.2 文字列に変換
    主に文字列の加算で発生します.文字列以外の値はStringを呼び出して文字列に変換し、加算します.
    '5' + 1 // '51'
'5' + true // "5true"
'5' + false // "5false"
'5' + {} // "5[object Object]"
'5' + [] // "5"
'5' + function (){} // "5function (){}"
'5' + undefined // "5undefined"
'5' + null // "5null"
    2.3 数値に変換
    加算(+)以外は演算子を文字列に変換しますが、他の演算子は演算子がNumber関数を呼び出して数値に変換します.
    '5' - '2' // 3
'5' * '2' // 10
true - 1  // 0
false - 1 // -1
'1' - 1   // 0
'5' * []    // 0
false / '5' // 0
'abc' - 1   // NaN
null + 1 // 1
undefined + 1 // NaN    Number(undefined)    NaN
    1元の演算子も演算子を数値に変換します.
    +'abc' // NaN
-'abc' // NaN
+true // 1
-false // 0
    JavaScript循環語句(詳細紹介)