201

Javascript has lot's of "tricks" around types and type conversions so I'm wondering if these 2 methods are the same or if there is some corner case that makes them different?

CC BY-SA 2.5

5 Answers 5

226

They are not completely the same, and actually, the String constructor called as a function (your first example), will at the end, call the toString method of the object passed, for example:

var o = { toString: function () { return "foo"; } };
String(o); // "foo"

On the other hand, if an identifier refers to null or undefined, you can't use the toString method, it will give you a TypeError exception:

var value = null;
String(null);     // "null"
value.toString(); // TypeError

The String constructor called as a function would be roughly equivalent to:

value + '';

The type conversion rules from Object-to-Primitive are detailed described on the specification, the [[DefaultValue]] internal operation.

Briefly summarized, when converting from Object-to-String, the following steps are taken:

  1. If available, execute the toString method.
    • If the result is a primitive, return result, else go to Step 2.
  2. If available, execute the valueOf method.
    • If the result is a primitive, return result, else go to Step 3.
  3. Throw TypeError.

Given the above rules, we can make an example of the semantics involved:

var o = {
  toString: function () { return "foo"; },
  valueOf:  function () { return "bar"; }
};

String(o); // "foo"

// Make the toString method unavailable:
o.toString = null;

String(o); // "bar"

// Also make the valueOf method unavailable:
o.valueOf = null;

try { 
  String(o); 
} catch (e) {
  alert(e); // TypeError
}

If you want to know more about this mechanism I would recommend looking at the ToPrimitive and the ToString internal operations.

I also recommend reading this article:

CC BY-SA 4.0
4
57

value.toString() will cause an error if value is null or undefined. String(value) should not.

For example:

var value = null;
alert(value.toString());

will fail because value == null.

var value = null;
alert(String(value));

should display a message reading "null" (or similar), but it will not crash.

CC BY-SA 4.0
5
5

String(value) should have the same result as value.toString() in every case, except for values without properties like null or undefined. ''+value will produce the same result.

CC BY-SA 2.5
1
  • 2
    ''+value might not produce the same result as String(value) if value has both a toString() method and a valueOf() method. For example if value = {toString(){return "Hello World!"}, valueOf(){return 3}}, then String(value) will be "Hello World!" but ''+value will be 3. This is because the + operator looks for valueOf before toString, whereas String(...) only looks for toString. Commented Sep 1, 2022 at 10:04
2

I just tried this with ES6 and found out that for String() to look at valueOf() inside of the object, the object has to have toString() method. If the object does not have toString() then console returns '[object Object]' regardless of having valueOf() or not. So in the the first "step", we always have to have toString() regardless, else String() method wouldn't look at valueOf.

Please check this:

let obj = {
    name:'b',
    age:22,
    valueOf: function(){
        return 'heeee';
    }
}

String(obj); // prints '[object Object]'

On the other hand,

let obj = {
    name:'b',
    age:22,
    toString:null,
    valueOf: function(){
        return 'heeee';
    }
}
String(obj); // prints 'heeee'

let obj = {
  name: 'b',
  age: 22,
  valueOf: function() {
    return 'heeee';
  }
}

console.log(String(obj));

let obj2 = {
  name: 'b',
  age: 22,
  toString: null,
  valueOf: function() {
    return 'heeee';
  }
}

console.log(String(obj2));

CC BY-SA 4.0
1
  • Abstract Operation is working under the cover. If the value to be converted is an Object, ToPrimitive Abstract operation is first called. Which calls toString or valueOf. If the object is capable of being converted into more than 1 primitive types then Hint is passed. In above, object is String Object so toString will be called. If it returns the primitive value, then convert to string (if not already string). If returns a non primitive value then valueOf is called to get primitive value (to convert into string if not string via ToString Abstract method) otherwise Type Error is thrown.
    – Sadiq
    Commented Jul 28, 2023 at 12:16
1

String() [the constructor call] is basically calling the .toString()

.toString() and String() can be called on primitive values(number,boolean,string) and basically will do nothing special:

true => 'true'

false => 'false'

17 => '17'

'hello' => 'hello'

But calling these functions on objects is where things gets interesting:

if the object has it's own .toString() function it will be called when ever you need this object to be treated as a string(explicitly/implicitly)

let obj = {
           myName:"some object",
           toString:function(){ return this.myName; } 
          }

//implicitly treating this obj as a string
"hello " + obj; //"hello some object"

//OR (explicitly)
"hello " + String(obj) //calling the existent toString function

//OR
"hello " + obj.toString(); //calling toString directly

By the way if you want to treat this object as a number it should has a .valueOf() function defined in it.

what if we have both in one object?

if we want to treat this object as a string => use .toString()

if we want to treat this object as a number => use .valueOf()

what if we only have .valueOf() defined?

.valueOf() defined inside the object will be called whether we want to handle the object as a string or as a number

CC BY-SA 3.0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.