Преобразование значения в строку в JavaScript

В JavaScript есть три основных способа, которыми любое значение может быть преобразовано в строку. Этот пост в блоге объясняет каждый путь, а также его преимущества и недостатки.

• «» + значение: оператор плюс подходит для преобразования значения, когда оно окружено непустыми строками. В качестве способа преобразования значения в строку я нахожу его менее описательным для своих намерений. Но это дело вкуса, некоторые люди предпочитают такой подход к String (значение).
• String (value): этот подход довольно явный: примените функцию String () к значению. Единственная проблема состоит в том, что этот вызов функции сбивает с толку некоторых людей, особенно тех, кто приходит из Java, потому что String также является конструктором. Однако функция и конструктор дают совершенно разные результаты:

      > String("abc") === new String("abc")
      false
  
      > typeof String("abc")
      'string'
      > String("abc") instanceof String
      false
  
      > typeof new String("abc")
      'object'
      > new String("abc") instanceof String
      true
  

  Функция выдает, как и было обещано, строку ( примитив [1] ). Конструктор создает экземпляр типа String (объект). Последнее вряд ли когда-либо пригодится в JavaScript, поэтому обычно вы можете забыть о String как о конструкторе и сосредоточиться на его роли в преобразовании в строку.

Незначительная разница между «» + value и String (value)

До сих пор вы слышали, что + и String () преобразуют свои «аргументы» в строку. Но как они на самом деле это делают? Оказывается, они делают это немного по-разному, но обычно получают один и тот же результат.

Преобразование примитивов в строку

Оба подхода используют внутреннюю операцию ToString () для преобразования примитивов в строку. «Внутренний» означает: функцию, указанную в ECMAScript 5.1 (§9.8), которая недоступна для самого языка. В следующей таблице объясняется, как ToString () работает с примитивами.

Преобразование объектов в строку

Оба подхода сначала преобразуют объект в примитив, а затем преобразуют этот примитив в строку. Однако + использует внутренний оператор ToNumber () (за исключением дат
[2] ), в то время как String () использует ToString ().

• ToNumber (): чтобы преобразовать объект obj в примитив, вызовите obj.valueOf (). Если результат примитивный, верните этот результат. В противном случае, вызовите obj.toString (). Если результат примитивный, верните этот результат. В противном случае выведите ошибку TypeError.
• ToString (): работает так же, но вызывает obj.toString () перед obj.valueOf ().

С помощью следующего объекта вы можете наблюдать разницу:

    var obj = {
        valueOf: function () {
            console.log("valueOf");
            return {}; // not a primitive, keep going
        },
        toString: function () {
            console.log("toString");
            return {}; // not a primitive, keep going
        }
    };  

Взаимодействие:

    > "" + obj
    valueOf
    toString
    TypeError: Cannot convert object to primitive value

    > String(obj)
    toString
    valueOf
    TypeError: Cannot convert object to primitive value

Большинство объектов используют реализацию по умолчанию valueOf (), которая возвращает это для объектов. Следовательно, этот метод всегда будет пропущен ToNumber ().

    > var x = {}
    > x.valueOf() === x
    true

Экземпляры булевых, Number и String примитивов обертки и valueOf возвращают обернутый примитив. Но это все еще означает, что конечный результат будет таким же, как и для toString (), даже если он будет получен другим способом.

    > var n = new Number(756)
    > n.valueOf() === n
    false
    > n.valueOf() === 756
    true

Вывод

Какой из трех подходов для преобразования в строку вы должны выбрать? value.toString () может быть в порядке, если вы уверены, что значение никогда не будет нулевым или неопределенным. В противном случае, «» + value и String (value) в основном эквивалентны. То, что люди предпочитают, зависит от вкуса. Я считаю String (значение) более явным.

Похожие сообщения

1. Значения JavaScript: не все является объектом [примитивы против объектов]
2. Что такое {} + {} в JavaScript? [объясняет, как работает оператор +]
3. Конкатенация строк в JavaScript [как лучше конкатенировать много строк]