點燈坊

失くすものさえない今が強くなるチャンスよ

使用 toString() 將任意型別轉成 String

Sam Xiao's Avatar 2019-07-05

實務上常看到 String function、+ operator 與 toString() 將任意型別轉成 String，但其實都只能處裡 primitive，無法處理 object，使用 Ramda 的 toString() 是更安全做法。

Version

macOS Mojave 10.14.5
VS Code 1.36.0
Quokka 1.0.233
Ramda 0.26.1

String Function

let data0 = 123;
let data1 = true;
let data2 = { name: 'Sam' };

// toString :: * -> String
let toString = arg => String(arg);

toString(data0); // ?
toString(data1); // ?
toString(data2); // ?

使用 String() 可將 primitive 轉成 string，但 object 則回傳非預期的 [object Object]。

string000

+ Operator

let data0 = 123;
let data1 = true;
let data2 = { name: 'Sam' };

// toString :: * -> String
let toString = arg => arg + '';

toString(data0); // ?
toString(data1); // ?
toString(data2); // ?

也可以使用 + '' 將 primitive 轉成 string，但 object 則回傳非預期的 [object Object]。

string001

Number.prototype.toString()

let data0 = 123;
let data1 = true;
let data2 = { name: 'Sam' };

// toString :: * -> String
let toString = arg => arg.toString();

toString(data0); // ?
toString(data1); // ?
toString(data2); // ?

也可使用 ECMAScript 內建 Number.prototype.toString() 與、Boolean.prototype.toString() 將 primitive 轉成 string，但 Object.prototype.toString() 則回傳非預期的 [object Object]。

string002

Template String

let data0 = 123;
let data1 = true;
let data2 = { name: 'Sam' };

// toString :: * -> String
let toString = arg => `${arg}`;

toString(data0); // ?
toString(data1); // ?
toString(data2); // ?

ES6 迎來 template string，可將 primitive 轉成 string，但 object 則回傳非預期的 [object Object]。

string004

JSON.stringify()

let data0 = 123;
let data1 = true;
let data2 = { name: 'Sam' };

// toString :: * -> String
let toString = arg => JSON.stringify(arg);

toString(data0); // ?
toString(data1); // ?
toString(data2); // ?

也可以使用 JSON.stringify() 將 primitive 與 object 都轉成 string。

string003

Ramda

import { toString } from 'ramda';

let data0 = 123;
let data1 = true;
let data2 = { name: 'Sam' };

toString(data0); // ?
toString(data1); // ?
toString(data2); // ?

事實上 Ramda 已經內建 toString()，可直接使用，結果與 JSON.stringify() 相同。

toString()
* -> String
將任意型別轉成 string

*：data 為任意型別

String：回傳 string

string005

Conclusion

  • JSON.stringify() 與 Ramda 的 toString() 可同時處理 primitive 與 object
  • 實務上建議使用 Ramda 的 toString()，可讀性最高，且 primitive 與 object 皆可處理

Reference

Dr.Axel Rauschmayer, Speaking JavaScript
Samantha Ming, 5 Ways to Convert a Value to String in JavaScript
Ramda, toString()

# Ramda