У JavaScript типи даних конвертуються (перетворюються) у потрібний тип автоматично.
Наприклад коли потрібно вивести значення як рядок (String) JavaScript використовує метод toString() для всіх інших типів даних. Якщо очікується логічне значення наприклад для умовного оператора if то JavaScript перетворює будь який тип даних у true або false.
У випадку якщо очікується число то JavaScript перетворює значення у тип Number, якщо це не вдається перетворити буде отримано значення NaN.
'2'*2; // 4
'2'+2; // "22" об'єднює рядок і число, результатом є рядок
'2'-2; // 0
'2'/2; // 1
'2text'/2; // NaN
Зверніть увагу що при виконанні автоматичного перетворення типів JavaScript повертає значення тіж самі що і: Array(), Date(), Object(), Boolean(), Number(), String().
У наведеній нижче таблиці описано, як в JavaScript виконується перетворення значень з одного типу в інший:
| значення | String() | Number() | Boolean() | Array() | Object() | new Date() |
|---|---|---|---|---|---|---|
| "" порожній рядок | "" | 0 | false | [""] | String("") | Invalid Date |
| "текст" | "текст" | NaN | true | ["текст"] | String("текст") | Invalid Date |
| "1" | "1" | 1 | true | ["1"] | String("1") | Invalid Date |
| "0" | "0" | 0 | true | ["0"] | String("0") | Invalid Date |
| "-1" | "-1" | -1 | true | ["-1"] | String("-1") | Invalid Date |
| "016" | "016" | 16 | true | ["016"] | String("016") | Invalid Date |
| "0xff" | "0xff" | 255 | true | ["0xff"] | String("0xff") | Invalid Date |
| "2.5""2.5" | 2.5 | true | ["2.5"] | String("2.5") | Invalid Date | |
| ".03" | ".03" | 0.03 | true | [".03"] | String(".03") | Invalid Date |
| "2016-09-14 01:55:36" | "2016-09-14 01:55:36" | NaN | true | ["2016-09-14 01:55:36"] | String("2016-09-14 01:55:36") | Wed Sep 14 2016 01:55:36 GMT+0300 (EEST) |
| "2016-09-14" | "2016-09-14" | NaN | true | ["2016-09-14"] | String("2016-09-14") | Wed Sep 14 2016 03:00:00 GMT+0300 (EEST) |
| "2016" | "2016" | 2016 | true | ["2016"] | String("2016") | Fri Jan 01 2016 02:00:00 GMT+0200 (EET) |
| "false" | "false" | NaN | true | ["false"] | String("false") | Invalid Date |
| "true" | "true" | NaN | true | true | true | Invalid Date |
| 0 | "0" | 0 | false | [] | Number(0) | Thu Jan 01 1970 02:00:00 GMT+0200 (EET) |
| 1 | "1" | 1 | true | [null] | Number(1) | Thu Jan 01 1970 02:00:00 GMT+0200 (EET) |
| -0 | "0" | 0 | false | [] | Number(-0) | Thu Jan 01 1970 02:00:00 GMT+0200 (EET) |
| 2.5 | "2.5" | 2.5 | true | invalid array length | Number(2.5) | Thu Jan 01 1970 02:00:00 GMT+0200 (EET) |
| NaN | "NaN" | NaN | false | invalid array length | Number(NaN) | Invalid Date |
| Infinity | "Infinity" | Infinity | true | invalid array length | Number(Infinity) | Invalid Date |
| -Infinity | "-Infinity" | -Infinity | true | invalid array length | Number(-Infinity) | Invalid Date |
| true | "true" | 1 | true | [true] | Boolean(true) | Thu Jan 01 1970 02:00:00 GMT+0200 (EET) |
| false | "false" | 0 | false | [false] | Boolean(false) | Thu Jan 01 1970 02:00:00 GMT+0200 (EET) |
| undefined | "undefined" | NaN | false | [null] | Object() | Invalid Date |
| null | "null" | 0 | false | [null] | Object() | Thu Jan 01 1970 02:00:00 GMT+0200 (EET) |
| [] | "" | 0 | true | [[]] | Array() | Invalid Date |
| [1,2,3] | "1,2,3" | NaN | true | [[1,2,3]] | Array(1,2,3) | Fri Jan 02 1903 00:00:00 GMT+0200 (HMT) |
| [3] | "3" | 3 | true | [[3]] | Array(3) | Invalid Date |
| {} | "[object Object]" | NaN | true | [{}] | Object() | Invalid Date |
| function (){} | "function (){}" | NaN | true | [function (){}] | Function() | Invalid Date |
| Date('2016-09-15 14:54:05') | "Thu Sep 15 2016 14:54:05 GMT+0300 (EEST)" | 1473940445000 | true | ["Thu Sep 15 2016 14:54:05 GMT+0300 (EEST)"] | String("Thu Sep 15 2016 14:54:05 GMT+0300 (EEST)") | Thu Sep 15 2016 14:54:05 GMT+0300 (EEST) |
var s = String(2); //s="2";
s=new String(true); // "true"
var n = new Number("2.518"); //2.518
Number("2"); //2
Number("2.51"); // 2.51
Number(".51"); // 0.51
Number("2.51text"); //NaN
Number("t2.51"); // NaN
Boolean(1); //true
Boolean("false"); //true
Boolean("true"); //true
Інколи виникає необхідність зробити перетворення типів "вручну", для цього у JavaScript є методи (функції) які дозволяють перетворювати з одного типу даних у інший.
Якщо необхідно масив представити як рядок JavaSctipt по замовчуванню використовує метод Array.toString() який перетворює масив у рядок при цоьму елементи масиву розділяє комами:
var mas= [1, 2, 3, "чотири", [10, 20, 30] ];
alert(mas.toString()); // '1,2,3,чотири,10,20,30'
Для цього щоб перетворити масив у рядок і розділити елементи іншим символом використовують метод Array.join():
var mas= [1, 2, 3, "чотири", [10, 20, 30] ];
var s=mas.join('|');
alert( s ); // '1|2|3|чотири|10,20,30
Зверніть увагу що методи Array.toString() і Array.join() некоректно перетворюють багатовимірний масив.
Тому рекомендовано для повноцінного перетворення масиву у рядок використовувати метод JSON.stringify():
var mas= [1, 2, 3, "чотири", [10, 20, 30] ];
s=JSON.stringify(mas);
alert( s ); //'[1,2,3,"чотири",[10,20,30]]'
Для перетворення дати у рядок є методи: Date.toString() який викликається автоматично коли необхідно представити дату як рядок, Date.toDateString(), Date.toGMTString(), Date.toJSON(), Date.toLocaleDateString(), Date.toLocaleString(), Date.toLocaleTimeString(), Date.toTimeString(), Date.toUTCString():
var d = new Date('2016-09-15 14:08:45');
d.toDateString(); // "Thu Sep 15 2016"
d.toGMTString(); // "Thu, 15 Sep 2016 11:08:45 GMT"
d.toJSON(); // "2016-09-15T11:08:45.000Z"
d.toLocaleDateString(); // "09/15/2016"
d.toLocaleString(); // "Thu Sep 15 14:08:45 2016"
d.toLocaleTimeString(); // "14:08:45"
d.toTimeString(); // "14:08:45 GMT+0300 (EEST)"
s=d.toUTCString(); // "Thu, 15 Sep 2016 11:08:45 GMT"
Перетворити дату у число можливо лише принципом отримати кількість мілісекунд з 01.01.1970 методом Date.getTime():
var d=new Date('2016-09-15 14:54:05');
var n=d.getTime(); //n= 1473940445000
Перетворення рядок у ціле число за допомогою метода parseInt():
parseInt("123"); // 123
parseInt("23.5"); // 23
parseInt("-5"); // -5
parseInt("+3"); // 3
parseInt("2."); // 2
parseInt(".5"); // NaN
parseInt("2 текст"); // 2
parseInt("текст 2"); // NaN
parseInt(); //NaN
parseInt(""); //NaN
parseInt(undefined); //NaN
parseInt(true); //NaN
alert(parseInt("1+1")); //1
Перетворення рядок у число з плаваючою крапкою за допомогою parseFloat():
parseFloat("34"); //34
parseFloat("2.5"); //2.5
parseFloat("2.5текст"); //2.5
parseFloat("текс2.5"); //NaN
alert( parseFloat(".5") ); // 0.5
Витягнення числа з рядка за допомогою регулярного виразу:
//витягуємо ціле значення і перетворюмоє у число
parseInt("text 2.51 hu".match(/d+/)); // 2
//витягуємо значення з плаваючою крапкою і перетворюємо у число
parseFloat("text 2.51 hu".match(/d+.d+/)); // 2.51
//витягуємо будь яке цифрове значення і перетворюємо на число
parseFloat("text 25.1к hu".match(/d+.?d+/)); // 25.1
Перетворення рядка у масив відбувається за допомогою методу String.split():
var s='Віра|Надія|Любов';
var mas=s.split('|'); //["Віра", "Надія", "Любов"]
var mas= "JS,JavaScript,яваскрирт,джаваскрипт".split(','); // mas = ["JS", "JavaScript", "яваскрирт", "джаваскрипт"]
Перетворення рядка у дату відбувається методом створення об'єкту Date:
var s='2010-12-01 20:07:25';
var d=new Date(s);
var d=new Date('2016-09-14 20:21:56');
d=new Date('2016-09-14T17:21:56.000Z');
d=new Date("Wed Sep 14 2016 20:33:39 GMT+0300 (EEST)");
d=new Date("14-09-2016 21:08:51"); //invalid Date
Для перетворення рядкового представлення об'єкту (JSON) у об'єкт JavaScript використовується JSON.parse():
var s='{"test":"String object", "n":2}';
var ob=JSON.parse(s);
var ob=JSON.parse('{"a":5}');
alert( ob.a );
Так як при Boolean() будь який не порожній рядок дорівнює true, тому для рядків "true" і "false" потрібно використовувати JSON.parse():
var b=JSON.parse("true"); // true
b=JSON.parse("false"); // false
var b=JSON.parse("text"); // SyntaxError: JSON.parse: unexpected keyword at line 1 column 1 of the JSON data
b= JSON.parse("False"); // SyntaxError: JSON.parse: unexpected keyword at line 1 column 1 of the JSON data
//або просте порівняння
var s='false';
if(s=='false') b=false;
else b=true;
Повноцінний метод перетворення типів у логічний тип:
function ToBoolean(s){
if(s.toString().toLowerCase()=='false') return false;
return Boolean(s).valueOf();
}
b = ToBoolean(1); // true
var b = ToBoolean('false'); // false
alert('b: '+(typeof b)+' '+b);