JavaScript String concatenation behavior with null or undefined values

by

You can use Array.prototype.join to ignore undefined and null:

['a', 'b', void 0, null, 6].join(''); // 'ab6'

According to the spec:

If element is undefined or null, Let next be the empty String;
otherwise, let next be ToString(element).

Given that,

  • What is the history behind the oddity that makes JS converting null or undefined to their string value in String concatenation?

    In fact, in some cases, the current behavior makes sense.

    function showSum(a,b) {
    alert(a + ' + ' + b + ' = ' + (+a + +b));
}

    For example, if the function above is called without arguments, undefined + undefined = NaN is probably better than + = NaN.

    In general, I think that if you want to insert some variables in a string, displaying undefined or null makes sense. Probably, Eich thought that too.

    Of course, there are cases in which ignoring those would be better, such as when joining strings together. But for those cases you can use Array.prototype.join.

  • Is there any chance for a change in this behavior in future ECMAScript versions?

    Most likely not.

    Since there already is Array.prototype.join, modifying the behavior of string concatenation would only cause disadvantages, but no advantages. Moreover, it would break old codes, so it wouldn’t be backwards compatible.

  • What is the prettiest way to concatenate String with potential null or undefined?

    Array.prototype.join seems to be the simplest one. Whether it’s the prettiest or not may be opinion-based.

More Related Contents:

  1. Is there a standard function to check for null, undefined, or blank variables in JavaScript?
  2. What is the difference between null and undefined in JavaScript?
  3. How can I determine if a variable is ‘undefined’ or ‘null’?
  4. Why is null an object and what’s the difference between null and undefined?
  5. How to check for an undefined or null variable in JavaScript?
  6. JavaScript checking for null vs. undefined and difference between == and ===
  7. Why is there a `null` value in JavaScript?
  8. How to resolve TypeError: Cannot convert undefined or null to object
  9. What reason is there to use null instead of undefined in JavaScript?
  10. When is null or undefined used in JavaScript? [duplicate]
  11. Is it better to return `undefined` or `null` from a javascript function? [closed]
  12. Should JSON include null values [closed]
  13. How can I check for an empty/undefined/null string in JavaScript?
  14. How can I check for “undefined” in JavaScript? [duplicate]
  15. How can I unset a JavaScript variable?
  16. variable === undefined vs. typeof variable === “undefined”
  17. Why is string concatenation faster than array join?
  18. Why does this JavaScript code print “undefined” on the console?
  19. Why `null >= 0 && null
  20. forEach on array of undefined created by Array constructor
  21. getElementById() returns null even though the element exists [duplicate]
  22. Undefined values in Array(len) initializer
  23. How to set the id attribute of a HTML element dynamically with angularjs (1.x)?
  24. How dangerous is it in JavaScript, really, to assume undefined is not overwritten?
  25. Javascript – removing undefined fields from an object [duplicate]
  26. console.log(myFunction()) returns undefined
  27. JS checking deep object property existence [duplicate]
  28. Set a variable if undefined in JavaScript
  29. How to check null objects in jQuery
  30. JSLint: was used before it was defined

Leave a Comment