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

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

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

スコープとは、プログラム内で変数名など、参照可能な有効範囲のことを指します。

JavaScript

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

非同期処理

非同期処理とは一部のコードを別々のスレッドで実行させる手法です。アプリケーションのパフォーマンスを向上させる目的でこの手法を用います。

Q&A

解決済

1回答

1143閲覧

class内の onreadystatechange でスコープ外に値&class関数を実行する方法

退会済みユーザー

退会済みユーザー

総合スコア0

スコープ

スコープとは、プログラム内で変数名など、参照可能な有効範囲のことを指します。

JavaScript

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

非同期処理

非同期処理とは一部のコードを別々のスレッドで実行させる手法です。アプリケーションのパフォーマンスを向上させる目的でこの手法を用います。

0グッド

0クリップ

投稿2021/08/28 01:45

編集2021/08/28 02:21

URLの情報を獲得後にデータを処理しようとしています。
classの中でXMLHttpRequestを実行して、class内の関数へのアクセスにしました。

しかし、スコープの関係と思いますが、エラーが発生します。
また class変数への代入方法ができていないようです。

どのようにして、外部への値保存&関数呼び出しを実行すればよいでしょうか?

よろしくお願いします。

javascript

1class webreq = class { 2 constructor( act, name, path) { 3 this.act = null; 4 this.url = null; 5 this.itemJson = null; 6 } 7 8 getXhr(){ 9 console.log(this.url); 10 var act = this.act; //引数はvarで渡しています 11 12 let xhr= new XMLHttpRequest(); 13 xhr.open('GET', this.url, true); 14 xhr.send(); 15 xhr.onreadystatechange = function() { 16 17 // ここからスコープが変わるのだと思っています。 18 if (xhr.readyState == 4 && xhr.status == 200) { 19 let resText = xhr.response.toString(); 20 const matches = resText.match(/var initialData = (.*?);</script>/); 21 if(matches){ 22 resText = matches[1]; 23 24 // ↓ class変数の代入ではなさそう 25 this.itemJson = JSON.parse(resText); 26 } 27 28 // this.act だとエラーになるので var act で受け取り 29 if( act ){ 30 // ↓ ここでエラーになります。 31 this.setListVideoData(); 32 } 33 } 34 } 35 } 36 setListVideoData () { 37 //ここでいろいろデータ加工しています 38 } 39}

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

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

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

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

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

m.ts10806

2021/08/28 01:48

全角スペースいっぱいありますが、これは?
m.ts10806

2021/08/28 01:50

>// ↓ ここでエラーになります。 と書かれていますが、 class act = ここでエラーになります。 手元のコードから何か変えてるんでしょうか。
退会済みユーザー

退会済みユーザー

2021/08/28 02:15

コードを貼り付けたときに整形するためにスペースを入れた時に全角スペースが入ったのだと思います。 classはもっと長いのですが、問題部分を抜き出しました。class act は不適切でした。修正します。
guest

回答1

0

ベストアンサー

たぶんthisが指すものが変わるので確認してみてください。

js

1 getXhr(){ 2 var self = this; // 3 console.log(this); // 4 console.log(this.url); 5 var act = this.act; //引数はvarで渡しています 6 7 let xhr= new XMLHttpRequest(); 8 xhr.open('GET', this.url, true); 9 xhr.send(); 10 xhr.onreadystatechange = function() { 11 console.log(this); // 12 13 // ここからスコープが変わるのだと思っています。 14 if (xhr.readyState == 4 && xhr.status == 200) { 15 let resText = xhr.response.toString(); 16 const matches = resText.match(/var initialData = (.*?);</script>/); 17 if(matches){ 18 resText = matches[1]; 19 20 // ↓ class変数の代入ではなさそう 21 this.itemJson = JSON.parse(resText); 22 self.itemJson = JSON.parse(resText); 23 console.log(this,self); // 24 } 25 26 // this.act だとエラーになるので var act で受け取り 27 if( act ){ 28 // ↓ ここでエラーになります。 29 self.setListVideoData(); 30 } 31 } 32 } 33 }

投稿2021/08/28 02:31

kei344

総合スコア69364

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

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

退会済みユーザー

退会済みユーザー

2021/08/28 02:49

ありがとうございます! 解決しました。 自分自身を var で格納して引き渡すのはまったく思いつきませんでした。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問