サンプルファイルが本のとおりに動かない

Question

お世話になっております。
「Ajaxライブラリ徹底活用 JavaScript Webプログラミング」という本で
JavaScriptを勉強しているのですが、本の通りに入力してるつもりなの
ですが、結果が本とは違う結果になってしまいます。
↓入力したソース

function MyData(name,mail,tel){
	this.name = name;
	this.mail = mail;
	this.tel = tel;
	
	this.toString = function(){
		return "[MyData " + this.name + "]";
	}
	this.equals = function(that){
		return this.valueOf().length == that.valueOf().length;
	}
	this.valueOf = function(){
		return this.toString();
	}
	this.compareTo = function(that){
		return this.valueOf().length - that.valueOf().length;
	}
}

var person1 = new MyData("山田太郎","[e-mail]","090-9999-9999");
var person2 = new MyData("田中花子","[e-mail]","080-8888-8888");


if (person1 > person2){
	document.write(person1 + "が大きい。");
} else if (person1 < person2){
	document.write(person2 + "が大きい。。");
} else {
	document.write(person1 + "と" + person2 + "は、同じ。");
}

↓結果
[MyData 田中花子]が大きい。。

↓本に書いてある結果
[MyData 山田太郎]と[MyData 田中花子]は、同じ。

自分でもソースを入力しましたし、
http://www.shuwasystem.co.jp/support/7980html/2431.html#2
のサンプルファイルのソースをコピーアンドペーストで貼り付けても
結果は
[MyData 田中花子]が大きい。。
でした。どこか入力間違いがあって本の通りに動かないのでしょうか？
どなたかお分かりの方がいれば教えていただければと思います。

追記
申し訳ありません。僕の勘違いみたいです。
僕が実行結果だと思った図には次の一文が添えられていました。
「図3-12：共通メソッドを修正し、同じ文字数のオブジェクトは同じものと判断するようにしたところ。」
つまり本に載ってるソースを修正して実行した結果が載ってたようです。
ご迷惑をおかけしました。

Answer 1

その書籍を持っていないので、著者の方の意図は図りかねますが、ちなみに、こうすると、[MyData 山田太郎]と[MyData 田中花子]は、同じ。 になりますね。

if (person1.compareTo(person2) > 0) {
    document.write(person1 + "が大きい。");
} else if (person1.compareTo(person2) < 0) {
    document.write(person2 + "が大きい。。");
} else {
    document.write(person1 + "と" + person2 + "は、同じ。");
}

---

追記

この compareTo() を使った例ですが、以下のように、name.length が異なる人同士を比較すると、正しく動いていることが確認できます。（Java の標準ライブラリに compareTo() というメソッド（関数の一種）があるので、多分、著者の方は、それを真似た例を示したかったのではないかと）

function MyData(name,mail,tel){
	this.name = name;
  this.mail = mail;
  this.tel = tel;

  this.toString = function(){
    return "[MyData " + this.name + "]";
  }
  this.equals = function(that){
    return this.valueOf().length == that.valueOf().length;
  }
  this.valueOf = function(){
    return this.toString();
  }
  this.compareTo = function(that){
    return this.valueOf().length - that.valueOf().length;
  }
}

var person1 = new MyData("山田太郎","[e-mail]","090-9999-9999");
var person2 = new MyData("田中花子","[e-mail]","080-8888-8888");
var person3 = new MyData("鈴木健太郎", "[e-mail]", "070-7777-7777");

var compare = function(person1, person2) {
  if (person1.compareTo(person2) > 0) {
    document.write(person1 + "が大きい。");
  } else if (person1.compareTo(person2) < 0) {
    document.write(person2 + "が大きい。");
  } else {
    document.write(person1 + "と" + person2 + "は、同じ。");
  }
  document.write("</br>");
}

compare(person1, person2);
compare(person1, person3);

結果

[MyData 山田太郎]と[MyData 田中花子]は、同じ。
[MyData 鈴木健太郎]が大きい。

Comments

[tada_tadaa]

ご回答ありがとうございます。
なんだかいろんなやり方があるようですし、このプログラム文の意味もまだ分かってない
んですが、tatsuya6502さまのご回答も参考になります。
ソース文を追って行ってなんとなく理解はできます。しかし考え出したらほかにももっとあ
るんじゃないという気になってきました。
ありがとうございました。

[tatsuya6502]

あ、コメントが行き違いになってしまいましたね。

if(person1.equals(person2) > person2.equals(person1) ){
document.write(person1 + "が大きい。");
...

ですが、それだと名前の長さが異なる人同士を比較した時に正しく動かないですね。多分、著者の方が示したかったのではないかと思う、正しく動く例を、追記しました。

[tada_tadaa]

コメントありがとうございます。
たしかに
if(person1.equals(person2) > person2.equals(person1) ){　の方法は
名前の長さが異なる人同士を比較した時に正しく動かないです。
tatsuya6502さまの追記の例では関数化？してますね。こういう方法もあるのかと
初歩的なことだと思いますが勉強になります。

Answer 2

"[MyData 田中花子]が大きい。" が出力される結果に間違いはないと思います。
同じと評価したいなら person1.name.length, person1.equals(), persion1.toString(), person1.valueOf() を使うコードでしょうか。
本題ではありませんが、prototype を使ったコードにするとメモリを節約できると思います。

• String 値の比較 - JSFiddle

'use strict';
function MyData(name,mail,tel){
  this.name = name;
  this.mail = mail;
  this.tel = tel;
}

MyData.prototype = {
  toString: function toString () {
    return "[MyData " + this.name + "]";
  },
  equals: function equals (that) {
    return this.valueOf().length == that.valueOf().length;
  },
  valueOf: function valueOf () {
    return this.toString();
  },
  compareTo: function compareTo (that) {
    return this.valueOf().length - that.valueOf().length;
  }
};

var person1 = new MyData("山田太郎","[e-mail]","090-9999-9999");
var person2 = new MyData("田中花子","[e-mail]","080-8888-8888");

console.log(person1.name.length === person2.name.length);             // true
console.log(person1.valueOf().length === person2.valueOf().length);   // true
console.log(person1.toString().length === person2.toString().length); // true
console.log(person1.equals(person2));                                 // true

if (person1 > person2){
    document.write(person1 + " が大きい。");
} else if (person1 < person2){
    document.write(person2 + " が大きい。。");
} else {
    document.write(person1 + "と" + person2 + " は、同じ。");
}

(更新履歴)

• 2016/03/20 09:08 person1.length から person1.name.length へ修正。prototype を使ったサンプルコード追記。

Re: tada_tadaa さん

Comments

[tada_tadaa]

ご回答ありがとうございます。
まだオブジェクト指向とかJavaScript がよくわかってないもので頭がこんがらがってます。
person1.lengthを使う方法ではamaranthineさんの
if (person1.name.length > person2.name.length){
が見た瞬間直観的に分かりやすいと思いました。（nameの長さを比べていることが分かる）
person1.equals()を使う方法は
if(person1.equals(person2) > person2.equals(person1) ){
document.write(person1 + "が大きい。");
} else if (person1.equals(person2) < person2.equals(person1) ){
document.write(person2 + "が大きい。");
}else {
document.write(person1 + "と" + person2 + "は、同じ。");
}
ではないかと思っていますが、意味はよく分かってないです。。
ありがとうございました。

[think49]

> person1.lengthを使う方法ではamaranthineさんの
すみません。仰る通り、person1.name.length が正しかったので親記事を修正しました。

> person1.equals()を使う方法は
person1.equals(person2) ですね。親記事にサンプルコードを追記しました。

[tada_tadaa]

chromeでconsole.logを使ってみましたがとても便利そうですね。
これでデバッグ作業が効率よくできそうです。
勉強になります。

Answer 3

「[MyData 田中花子]が大きい。」であってると思いますよ

person1 > person2 は [MyData 山田太郎] > [MyData 田中花子] という比較になります

JavaScript の比較は

文字列は、Unicode の値を用い、標準の辞書に基づいて比較されます。

MDN

という仕様なので 一緒になることはまずないはずです

Comments

[tada_tadaa]

ご回答ありがとうございます。
本をよく読んでみると僕が実行結果だと思っていたものは、修正して実行されたもので
ソースの通りに実行したものじゃないようです。僕の理解力不足でご迷惑をおかけしました。
「これ」とは書いてないのですが、本をよく読むと次のようなソース文を書いて僕が実行結果
だと勘違いした結果が得られたのではないだろうかと思います。
if(person1.equals(person2) > person2.equals(person1) ){
document.write(person1 + "が大きい。");
} else if (person1.equals(person2) < person2.equals(person1) ){
document.write(person2 + "が大きい。");
}else {
document.write(person1 + "と" + person2 + "は、同じ。");
}

[tatsuya6502]

これだと、名前の長さが違う人同士を比較した時にうまく動かないですね。（コメントにコードを貼ると、きれいに表示できないので、自分の回答の方に追記しました）

Answer 4

ちゃんと全部読んでないテキトーな回答ですが、最後の部分を以下のようにするのが意図でしょうか。

if (person1.compareTo > person2.compareTo){
    document.write(person1 + "が大きい。");
} else if (person1.compareTo < person2.compareTo){
    document.write(person2 + "が大きい。。");
} else {
    document.write(person1 + "と" + person2 + "は、同じ。");
}

一応「同じ」と返ってきました。

追記
と書きましたが、意図が分からんと指摘されたので修正します（私も分かってません）。とはいえ、未だにどういう意図のコードか図りかねてます。どの大きさを比較してるのか。関数が同じと言いたいのか、不明です。とりあえず、名前の長さで比較しました。

if (person1.name.length > person2.name.length){
    document.write(person1 + "が大きい。");
} else if (person1.name.length < person2.name.length){
    document.write(person2 + "が大きい。。");
} else {
    document.write(person1 + "と" + person2 + "は、同じ。");
}

Comments

[ryls-nmm]

それだと compareTo という関数自体を比較するというおかしなことになってますね
同じ関数なので一緒になりますが、なにをしたいのかわからないことになります

[tada_tadaa]

ご回答ありがとうございます。
amaranthineさんが教えてくださった方法を試したところ僕も「同じ」と返ってきました。
よく分りませんが、「[MyData 田中花子]が大きい。」で合っているようです。
本の結果（だと思っていた）には、次のような一文が書いてあったので、結果じゃなくて修正
して実行した結果だったようです。
「図3-12：共通メソッドを修正し、同じ文字数のオブジェクトは同じものと判断するようにしたところ。」
僕の理解力不足で、実行結果だと思ってました。しかし、みなさんの回答のおかげで本に書い
てあることが少し理解できるようになりました。

[amaranthine]

ええ、大きいで合っているのはその通りなのですが、コードを修正して同じと返したいということかと思っていました。そのため、同じに返したかったのですが、ryls-nmmさんの言うとおり、当初のコードはわけわかめでした。追記後のコードは、「同じ文字数のオブジェクトは同じものと判断」するようにしています。

[tada_tadaa]

if (person1.name.length > person2.name.length){
なら僕でも直観的に理解しやすいです。実行結果も同じになりました。
いろんなやり方があるみたいで、どれが正しいのかまだ初心者の僕には分らないですね。