質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

3回答

598閲覧

同じ結果を出力する下記のコードの違いとベストなコードを教えて下さい

fiile

総合スコア16

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2019/07/29 22:57

編集2019/07/29 23:17

前提・実現したいこと
下記の4つのコードの違いとベストな書き方が知りたいです。
たとえば1つ目のbornYear()はなぜthisでpersonを取得できるのか不思議です。

JavaScript

1function person(name, age) { 2 this.name= name; 3 this.age = age; 4 this.yearOfBirth = bornYear; 5} 6function bornYear() { 7 return 2019 - this.age; 8} 9 10var p = new person("A", 22); 11 12console.log(p.yearOfBirth()); 13

JavaScript

1function person(name, age) { 2 this.name= name; 3 this.age = age; 4 this.yearOfBirth = bornYear(n); 5} 6function bornYear(n) { 7 return 2019 - n; 8} 9 10var p = new person("A", 22); 11 12console.log(p.yearOfBirth) 13

JavaScript

1function person(name, age) { 2 this.name= name; 3 this.age = age; 4 this.yearOfBirth = function(n) { 5 return 2019 - n; 6} 7} 8 9var p = new person("A", 22); 10 11console.log(p.yearOfBirth(22)); 12

JavaScript

1function person(name, age) { 2 this.name= name; 3 this.age = age; 4 this.yearOfBirth = return 2019 - age; 5} 6 7var p = new person("A", 22); 8 9console.log(p.yearOfBirth); 10 11

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

yasutomi

2019/07/29 23:12

このコードはエラーになって実行されないため エラーを解消してから再度ご質問をお願いします。
fiile

2019/07/29 23:18

失礼しました。修正いたしました。よろしくお願いします。
guest

回答3

0

ベストアンサー

コンストラクタ関数

ごく普通のコンストラクタ関数なので、コンストラクタの基本を学んでから、比較を試みて下さい。
基本を押さえずに、比較しても理解できません。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Creating_New_Objects/Using_a_Constructor_Function

this

たとえば1つ目のbornYear()はなぜthisでpersonを取得できるのか不思議です。

thisperson ではありません。
個人サイトには、下記の表現で説明しているところがありますが、

  • this は person である
  • this は自身である
  • thisはコンストラクタそのものである

比較すれば、間違っている事は明らかなので、信用しないで下さい。

JavaScript

1console.log(this === person);

等価性を期待するなら、下記コードになります。

JavaScript

1console.log(Object.getPrototypeOf(this) === person.prototype);

この原理を把握するには、プロトタイプチェーンを理解する必要があります。
https://teratail.com/search?q=prototype+chain

年齢から誕生年を逆算

年齢から誕生年を逆算する事は出来ません。
例えば、「誕生日を迎えた20歳」と「誕生日前の20歳」を区別する方法がありません。
例示の4つのコードは全て好ましくないと考えられます。

改善案として、「名前」「誕生日」をインスタンスプロパティに持つコンストラクタまたは、class構文があります。
が、ベストなコードを暗記する学習法は応用が利かなくなるので、お勧めしません。

Re: fiile さん

投稿2019/07/29 23:24

編集2019/07/30 00:00
think49

総合スコア18156

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

think49

2019/07/30 03:14

回答内容に間違いがあれば、ご指摘下さい(低評価されているので)。
fiile

2019/07/31 00:12

ありがとうございます。コンストラクタ関数についてもう少し理解してから比較してみます。 また、thisの中身も勘違いしておりました。 助かりました。
guest

0

普通に今風にかけばclassですかね

javascript

1class person { 2 constructor(name, age){ 3 this.name= name; 4 this.age = age; 5 this.yearOfBirth = this.bornYear; 6 } 7 bornYear(){ 8 return 2019 - this.age; 9 } 10} 11var p = new person("A", 22); 12console.log(p.yearOfBirth()); 13//console.log(p.bornYear()); で十分?

投稿2019/07/30 01:52

yambejp

総合スコア114572

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

fiile

2019/07/31 00:15

ありがとうございます! クラス構文も合わせて学びたいと思います。
guest

0

2番目と4番目はエラーを出します。特に4番目は文法がおかしいので論外です。
1番目と3番目の違いは、yearOfBirthが指す関数をインスタンスごとに持っているか、クラスで持っているか、の違いです。

js

1function person(name, age) { 2 this.name= name; 3 this.age = age; 4 this.yearOfBirth = bornYear; 5} 6function bornYear() { 7 return 2019 - this.age; 8} 9 10var p1 = new person("A", 22); 11var p2 = new person("A", 22); 12 13p1.yearOfBirth === p2.yearOfBirth; 14/* 15true 16*/

js

1function person(name, age) { 2 this.name= name; 3 this.age = age; 4 this.yearOfBirth = function(n) { 5 return 2019 - n; 6 } 7} 8 9var p1 = new person("A", 22); 10var p2 = new person("A", 22); 11 12p1.yearOfBirth === p2.yearOfBirth; 13/* 14false 15*/

1つ目のbornYear()はなぜthisでpersonを取得できるのか不思議です

それは勘違いです。thispersonではなくてpです。

ベストな書き方が知りたいです。

いろいろな意見があると思いますが、個人的にはクラス構文で書いた方がいいと思います。

投稿2019/07/30 01:44

編集2019/07/30 01:47
Lhankor_Mhy

総合スコア35860

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

fiile

2019/07/31 00:20 編集

失礼しました。 2番目は出力の際に引数が抜けていたのと、4番目はreturnが不要でした。 'this'は'p'だったんですね、、 前提から間違えて認識しておりした。 ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問