ホームページ > ウェブフロントエンド > jsチュートリアル > Javascript における valueOf と toString の比較入門 (コード例)

Javascript における valueOf と toString の比較入門 (コード例)

不言
リリース: 2019-02-13 10:18:18
転載
2631 人が閲覧しました

この記事では Javascript の valueOf と toString についての比較紹介 (コード例) を紹介します。必要な方は参考にしていただければ幸いです。

+{ a: 1, toString: function() { return '10' }, valueOf: function() { return '100' } }
ログイン後にコピー

上記はオブジェクト データ変換の問題につながります:
すべてのオブジェクトは 2 つの変換メソッドを継承します:

  1. toString(): その関数は A を返すことです。このオブジェクトを反映する文字列

  2. valueOf(): その機能は、対応する元の値

toString( )## を返すことです。

#toString() 関数の機能は、オブジェクトの文字列表現を返すことです。

JavaScript のオブジェクトのデフォルトの toString() メソッドは、文字列「[object Object]」を返します。クラスを定義するときに、新しい toString() メソッドを実装して、より読みやすい結果を返すことができます。
JavaScript は、
配列オブジェクト、関数オブジェクト、正規表現オブジェクト、日付日付オブジェクトに対して、より読みやすい toString() メソッドを定義します。

Array の toString() このメソッドは、カンマ区切りの文字列を返します。配列のメンバー。

var arr = [1, 2, 3]
arr.toString() // "1,2,3"
ログイン後にコピー
Function の toString() メソッドは、関数のテキスト定義を返します。

var fun = function() { return 'fun' }
fun.toString() // "function() { return 'fun' }"
ログイン後にコピー
RegExp の toString() メソッドは Function の toString() メソッドに似ており、正規表現のテキスト定義を返します。

var reg = /d+/g
reg.toString() // "/d+/g"
ログイン後にコピー
Date の toString() メソッドは、読み取り可能な日付と時刻の文字列を返します。

var date = new Date()
date.toString() // "Tue Feb 12 2019 14:04:36 GMT+0800 (中国标准时间)"
ログイン後にコピー
ブール値が true の場合は、「true」を返します。それ以外の場合は、「false」を返します。

var boolean = true
boolean.toString() // "true"
ログイン後にコピー

valueOf()

valueOf() 関数は、オブジェクト自体を返します。

toString() と同様に、必要な結果を返すクラスを定義するときに、新しい valueOf() メソッドを実装できます。
JavaScript は、Date オブジェクトに対して、より読みやすい valueOf() メソッドを定義します。

Date の valueOf() メソッドは、Date オブジェクトと

1970 の間の日付であるタイムスタンプ値を返します。 1月1日0時からの時差(ミリ秒)。

var date = new Date()
date.valueOf() // 1549951476233
ログイン後にコピー
  • 他のものはオブジェクト自体を返します。

Example

var colors = ["red", "blue", "green"] // 创建一个包含3 个字符串的数组 
alert(colors.toString()) // red,blue,green 
alert(colors.valueOf()) // red,blue,green 
alert(colors) // red,blue,green
ログイン後にコピー

3 つの出力はすべて同じですが、toString() と valueOf() の違いは何でしょうか?私が作成した次の例を見てください:

var arr = [1,2,3]
alert(Array.isArray(arr.valueOf())) // true
alert(Array.isArray(arr.toString())) // false
ログイン後にコピー
結果は、最初のものが true で、2 番目のものが false です。なぜでしょうか。実際、valueOf() が呼び出された後も、配列が返されます。この配列がアラートされると、toString() 関数が呼び出されるため、valueOf() 関数と toString() 関数は同じではありませんが、toString() 関数は間接的に呼び出されます。

さらなるテスト:

var arr = [1,2,3] 
arr.toString = function () { 
  alert("调用了toString函数");
} 
alert(arr.valueOf()) // "调用了toString函数"
ログイン後にコピー
結果として、「`toString 関数が呼び出される」ことがわかります。

次のコードを確認してください。

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 は、オブジェクト タイプに最適な元の値を返すことを意味し、toString はオブジェクト タイプの元の値を文字列形式で返します。

例 1

alert(test) // 10 toString
ログイン後にコピー
ここでは、アラート関数は文字列である必要があるため、元の値の代わりに文字列が取得されるため、toString## が呼び出されます

#例 2

alert(+test) // 10 valueOf
ログイン後にコピー
同様に、アラートが要求しているのは、文字列が元の値ではないことです。実際、(テスト) の結果は toString を呼び出し、テストは valueOf# と呼ばれます。 ##検証するには、次のように記述します。

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
ログイン後にコピー

test2 = test とすると、予想どおり、test2 の valueOf と test2 の toString が呼び出されます。

例 3

alert('' + test) // 10 valueOf
ログイン後にコピー
同様に、前の段落で書いたプログラムの test2: test を test2:'' test

例 4

に変更できます。

alert(String(test)) // 10 toString
ログイン後にコピー
String は、実際には、渡されたパラメータの toString 関数を内部で呼び出す強制変換です。例 5

alert(Number(test)) // 10 valueOf
ログイン後にコピー
例 6

alert(test == '10') // true valueOf
ログイン後にコピー

この中の等価性 シーケンスとしては、元の値を取得してから、両側の元の値が等しいかどうかを判断するため、valueOf

を呼び出します。例 7

alert(test === '10') // false
ログイン後にコピー

===

演算子は暗黙的な変換を実行しません。一致を判断するための最初のステップは、型が異なるため、後で何も呼び出されません。

概要

valueOfは操作に偏り、toStringは表示に偏ります。

文字列型を強制変換する場合は toString メソッドが最初に呼び出され、文字列型を強制変換する場合は最初に valueOf メソッドが呼び出されます。

演算子の場合、valueOf は toString よりも優先されます。

valueof と tostring の違いを簡単に説明します。

valueOf(): オブジェクト タイプに最適な元の値を返します。

toString(): オブジェクトを変換します。 to 元の値は文字列の形式で返されます。

これら 2 つのメソッドは、通常、さまざまな操作状況に合わせて JS によって暗黙的に呼び出されます。

数値演算では、b などの valueOf() が最初に呼び出されます。

文字列演算では、alert(c) などの toString() が最初に呼び出されます。

以上がJavascript における valueOf と toString の比較入門 (コード例)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:segmentfault.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート