Introduction comparative à valueOf et toString en Javascript (exemple de code)

Cet article vous apporte une introduction comparative (exemple de code) sur valueOf et toString en Javascript. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

+{ a: 1, toString: function() { return '10' }, valueOf: function() { return '100' } }

Ce qui précède conduit au problème de la conversion des données des objets :
Tous les objets héritent de deux méthodes de conversion :

1. toString() : ce qu'il fait renvoie une chaîne qui reflète cet objet

2. valueOf() : Sa fonction est de renvoyer sa valeur d'origine correspondante

toString()

La fonction toString() consiste à renvoyer la représentation sous forme de chaîne de l'objet.
La méthode d'objet toString() par défaut en JavaScript renvoie la chaîne "[object Object]". Lors de la définition d'une classe, vous pouvez implémenter la nouvelle méthode toString() pour renvoyer des résultats plus lisibles.
JavaScript définit une méthode toString() plus lisible pour les objets tableau, les objets fonction, les objets d'expression régulière et les objets Date :

ToString() du tableau La méthode renverra un tableau séparé par des virgules membres.

var arr = [1, 2, 3]
arr.toString() // "1,2,3"

La méthode toString() de la fonction renverra la définition textuelle de la fonction.

var fun = function() { return 'fun' }
fun.toString() // "function() { return 'fun' }"

La méthode toString() de RegExp est similaire à la méthode toString() de Function et renverra la définition textuelle de l'expression régulière.

var reg = /d+/g
reg.toString() // "/d+/g"

La méthode toString() de Date renverra une chaîne de date et d'heure lisible.

var date = new Date()
date.toString() // "Tue Feb 12 2019 14:04:36 GMT+0800 (中国标准时间)"

Si la valeur booléenne est vraie, retournez "true". Sinon, renvoie "false".

var boolean = true
boolean.toString() // "true"

valueOf()

La fonction valueOf() consiste à renvoyer l'objet lui-même.
Identique à toString(), vous pouvez implémenter la nouvelle méthode valueOf() lors de la définition d'une classe pour renvoyer les résultats requis.
JavaScript définit une méthode valueOf() plus lisible pour l'objet Date :

La méthode valueOf() de Date renverra une valeur d'horodatage, qui est la date entre l'objet Date et 1970. décalage horaire (en millisecondes) à partir de 0h00 le 1er janvier.

var date = new Date()
date.valueOf() // 1549951476233

• D'autres renverront l'objet lui-même.

Exemple

var colors = ["red", "blue", "green"] // 创建一个包含3 个字符串的数组 
alert(colors.toString()) // red,blue,green 
alert(colors.valueOf()) // red,blue,green 
alert(colors) // red,blue,green

Les trois sorties sont toutes identiques, alors quelle est la différence entre toString() et valueOf() ? Regardez l'exemple suivant que j'ai écrit :

var arr = [1,2,3]
alert(Array.isArray(arr.valueOf())) // true
alert(Array.isArray(arr.toString())) // false

Le résultat est que le premier est vrai et le second est faux. Pourquoi en fait, après l'appel de valueOf(), il renvoie toujours un tableau. . Lorsque ce tableau est alerté, la fonction toString() sera appelée, donc les fonctions valueOf() et toString() ne sont pas les mêmes, mais la fonction toString() est appelée indirectement !
Tests supplémentaires :

var arr = [1,2,3] 
arr.toString = function () { 
  alert("调用了toString函数");
} 
alert(arr.valueOf()) // "调用了toString函数"

Le résultat est que nous verrons "la fonction `toString a été appelée".
Vérifiez le code suivant :

var test = { 
  value: 10, 
  toString: function() { 
    console.log('toString')
    return this.value
  }, 
  valueOf: function() { 
    console.log('valueOf')
    return this.value
  } 
} 
alert(test) // 10 toString 
alert(+test) // 10 valueOf 
alert('' + test) // 10 valueOf 
alert(String(test)) // 10 toString 
alert(Number(test)) // 10 valueOf 
alert(test == '10') // true valueOf 
alert(test === '10') // false

valueOf signifie renvoyer la valeur d'origine la plus adaptée au type d'objet, tandis que toString renvoie la valeur d'origine du type d'objet sous la forme d'une chaîne.

Exemple 1

alert(test) // 10 toString

Ici, notre fonction d'alerte doit être une chaîne, donc la chaîne est obtenue à la place de la valeur d'origine, donc toString est appelée

Exemple 2

alert(+test) // 10 valueOf

De même, ce que veut l'alerte, c'est que la chaîne ne soit pas la valeur d'origine. En fait, c'est le résultat de (+test) qui appelle. toString, et + test s'appelle valueOf
Afin de vérifier, nous écrivons comme ceci :

var test = { 
  value: 1, 
  valueOf: function () { 
    alert("调用了test的valueOf函数")
    return this.value 
  }, 
  toString: function () { 
    alert("调用了test的toString函数") 
    return this.value 
  } 
}; 
var test2 = { 
  value: +test, 
  valueOf: function () { 
    alert("调用了test2的valueOf函数") 
    return this.value;
  }, 
  toString: function () { 
    alert("调用了test2的toString函数")
    return this.value 
  } 
}; 
alert(test2)
// 调用了test的valueOf函数
// 调用了test2的toString函数
// 1

Laissez test2 = +test, alors vous pouvez connaître le résultat Comme prévu, valueOf de test et. toString

Exemple 3

alert('' + test) // 10 valueOf

De même, nous pouvons changer test2: + test dans le programme écrit dans le paragraphe précédent en test2:' ' + test

Exemple 4

alert(String(test)) // 10 toString

String cast appelle en fait en interne la fonction toString du paramètre passé

Exemple 5

alert(Number(test)) // 10 valueOf

Exemple 6

alert(test == '10') // true valueOf

L'ordre d'égalité dans ceci est d'obtenir la valeur d'origine, puis de déterminer si les valeurs d'origine des deux côtés sont égales, alors appelez valueOf

Exemple 7 L'opérateur

alert(test === '10') // false

n'effectue pas de conversion implicite. La première étape pour déterminer la congruence consiste à déterminer le type car les types. sont différents, rien ne suit. Will call ===

summary

valueOf est orienté vers l'opération, et toString est orienté vers l'affichage.

Lorsque le type de chaîne est forcé d'être converti, la méthode toString sera appelée en premier, et lorsque le type de chaîne est forcé d'être converti, la méthode valueOf sera appelée en premier.

Dans le cas des opérateurs d'opération, valueOf a une priorité plus élevée que toString.

Permettez-moi d'expliquer brièvement la différence entre valueof et tostring :

valueOf() : renvoie la valeur d'origine la plus adaptée au type d'objet

toString() : convertit l'objet La valeur d'origine est renvoyée sous forme de chaîne

Ces deux méthodes sont généralement appelées implicitement par JS pour répondre à différentes situations de fonctionnement.

Dans les opérations numériques, valueOf() sera appelé en premier, comme a + b

Dans les opérations sur chaîne, toString() sera appelé en premier, comme alert(c)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!