JavaScriptのアロー関数でオブジェクト定義エラー

前提・実現したいこと

JavaScriptでおみくじプログラムを作っています。
アロー関数を用いているのですが、うまく作動せずエラーがでてしまいました。
アロー関数を用いて書きたいのですが、どうしたらよいでしょうか。
初心者質問で恐縮ですが、ご教授お願い致します。

発生している問題・エラーメッセージ

Uncaught TypeError: Cannot read property 'length' of undefined
    at Object.getResult (app.js:15)
    at app.js:1

該当のソースコード

JavaScript
1//おみくじオブジェクトの定義
2let omikuji = {
3    results: ["大吉", "中吉", "小吉", "凶"],
4    getResult: () => {
5        let results = this.results;
6        return results[Math.floor(Math.random() * results.length)];
7    }
8}
9
10console.log(omikuji.getResult());
11

試したこと

getResult:()=>をgetResult: function(){にしたら正常に作動します。
調べたところ、アロー関数ではthisの仕様が違う可能性が考えられましたが、結局よくわかりません。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

行動規範の内容に同意します

回答2件

ベストアンサー

アロー関数ではthisの仕様が違う可能性が考えられましたが、結局よくわかりません。

そのとおりです。アロー関数では、thisは書いた場所でのthisに固定されます。

（オブジェクトをthisとして参照する必要のある）メソッドとして使うには不適当なので、メソッド用の記法を使ってください。

javascript
1let omikuji = {
2    results: ["大吉", "中吉", "小吉", "凶"],
3    getResult() {
4        let results = this.results;
5        return results[Math.floor(Math.random() * results.length)];
6    }
7}