常連

注目の的

社会貢献

質問力

質問者

模範生

自己紹介

### 前提・実現したいこと
firebaseを学び始めて、チャットアプリを作成している者です。現在アプリ内でユーザー用に一意のマイページを作りたいと思っているのですが、以前使っていたRailsのルーティングのような概念がなさそうなため、どう実装したらいいのかわかりません。

このようにしたいです→ 『https://example.com/mypage/一意のID』

質問がざっくりすぎてすみません(￣▽￣;)

よろしくお願いいたします！

Firebaseを使ったマイページの作り方

### 前提・実現したいこと

先輩からシングルトンのスクリプトを教えてもらい、早速使ってみようと思いましたが、ネットの記事とかで紹介されてるような動きをしないです。　継承を使ったことがないので使い方があってるかどうかも教えて欲しいです。
教えてもらった先輩にはしばらく会えないため質問しました。

### 発生している問題・エラーメッセージ
シーンを移動してから同じシーンに戻るとオブジェクトが増えている。
シングルトンの役割を果たしていない


### 該当のソースコード

```c#
public class SceneController : SingletonMonoBehaviour<SceneController>
{
	private void Awake()
	{
		DontDestroyOnLoad(this.gameObject);
	}
	public void GoTitle(){
		SceneManager.LoadScene("TitleScene");
	}

	public void GoStageSelect(){
		SceneManager.LoadScene("StageSelectScene");
	}

	public void StageLoad(string scenename){
		SceneManager.LoadScene(scenename);
	}
}
```
### 貰ったシングルトンのコード
```c#
public class SingletonMonoBehaviour<T> :MonoBehaviour where T: MonoBehaviour {
    private static T _instance;

    public static T Instance
    {
        get
        {
            if(_instance == null)
            {
                //シーン上から取得する
                _instance = FindObjectOfType<T>();
				
            }

            //FindObjectOfType<T>();が失敗していないか
            if (_instance == null)
            {
                Debug.LogError(typeof(T) + "is nothing");
            }
            return _instance;
        }
    }

	protected virtual void Awake()
	{
		CheckInstance();
	}
	
	bool CheckInstance(){

	//this →　SingletonMonoBehaviour.cs自身
	//→　Singletonから呼び出されている。
	//→最初に作られたSingleton == 取得してきたSingleton
	if(this == Instance){ return true; }

		//今作られたものと最初に作られたのもが違った場合
		//今作られた物を削除する。
		Destroy(gameObject);//←thisにするとスクリプトだけ消える
		return false;
	}

	
}
```



### 補足情報（FW/ツールのバージョンなど）
Unity 2019.2.4f1

Unityでのシングルトンの使い方を知りたい

![イメージ説明](0ff65700beb0b5438fc5c0dbbe545c66.png)

![イメージ説明](7b24f383321f099f796d961742acbc37.png)

上記の設定から下記のイメージの様に文章を作成し、シーン内のテキストにリスト内の24の文章が表示される様に設定したのですがプログラミングの経験も浅くUnityでの初めてのアプリ作成でもあり、どの様にローカライゼーションするべきか分からずにいます。I2 Localizationをインポートしてみたのですがリストへの適用は難しそうだったのでここで質問させてもらいました。

![イメージ説明](6592a8ffe53ba9d72754066627c54e8f.png)

Localization++も使用しようと試してみたのですが現在の自分では柔軟に使いこなせそうにありませんでした。C#やUnityでのローカライゼーションに明るい方がいましたらアドバイスを頂けないでしょうか?

Unity: リスト内の複数の要素(文章)をローカライゼーションするアドバイスが欲しいです。

## 解決したいこと
今回作成しているコードは簡単に表すとApp.jsは以下のような構成になっています。定義した`BBBBB`をAppクラス内で引数を与えて表示するといったイメージなのですが、```BBBBB```のimgタグにonClickイベントを追加して別で準備しているページを表示させたいです。
```App
class App extends React.Component{
　　・
　　・
　　・
    render() {
        return(
            <div>
                {this.state.trades.map(e =>
                    <BBBBB
                        name = {e.name}
                        price = {e.Price}
                    />
                )}
            </div>
        );
    }
}

const BBBBB = (name, price)  => (
            <div>
                <img src='./sample.png' alt='' />
                <div>
                    <Switch>
                        <Route exact path={"/detail"} component={Detail} />
                    </Switch>
                </div>
            </div>
);

```

## やってみたこと
普段react-routerを使うときはクラス内でhandleClick関数を作って```this.props.histry.push(PATH)```みたいな感じで記述してonClickを実装していたのですが、今回はその手法が使えないのでどのようにしたらよいかわかりません。

どなたかご教示ください。よろしくおねがいします。

react-routerを使用した画面遷移を実装したい

主にThree.jsを使ってWebGLを勉強しています。

今のところ伝統的なHTML&CSS&JSの枠組みでWebGLの学習を進めているのですが、React上でThree.jsを使う場合どのようにするのが良いのだろう、という疑問が出ました。

調べたところ[react-three-fiber](https://github.com/drcmda/react-three-fiber)があるようなので、基本的にこれを使えば良いのかなと思うのですが、この場合素のThree.jsと比較して機能に制限などが出ることはあるでしょうか？

また、素のThree.jsをnpmモジュールとしてReactコンポーネントでimportして利用することもできるのでしょうか？
その場合React-three-fiberを利用した時と比べてメリットやデメリットなどはあるでしょうか？

初歩的な質問かと思うのですが、この辺り明るい方がいたらよろしくお願いします。

React上でThree.jsを使う良い方法はなんでしょう？

## 解決したいこと
{'name':'j', 'age':20}のようなオブジェクトから値を読み出す時に、keyに変数を用いたい

## 困っていること

```js
const John = {'name':'j', 'age':20}
const str = 'name';
```

というコードで、`John[str]`と書くことで値`'j'`を取り出したいがエラーになる。

## 詳細
以下のコードは期待通りに振る舞う。

```js
class Square extends React.Component<Props> {
  render() {
    const john:{name:string,age:number} = {name:'j',age:20}
    const johnName = john['name']
    return (
      <button className="square" onClick={this.props.onClick}>
        {johnName}
      </button>
    );
  }
}
```

![イメージ説明](f1eae9d6b1d124dfc89b4dc15b0dba4e.png)

Squareコンポーネントはclass内で定義した変数johnNameを表示する四角いボタンです。Johnのnameであるjが表示されており、期待通りの振る舞いです。

ここで'name'を変数にして以下のコードに書き換えます。

```js
class Square extends React.Component<Props> {
  render() {
    const john:{name:string,age:number} = {name:'j',age:20}
    const v:string = 'name' //変更
    const johnName = john[v] //変更
    return (
      <button className="square" onClick={this.props.onClick}>
        {johnName}
      </button>
    );
  }
}
```
これは以下のようなエラーとともに失敗します。

```
Failed to compile.

/Users/username/Desktop/react/Syogi/syogi/src/App.tsx
TypeScript error in /Users/username/Desktop/react/Syogi/syogi/src/App.tsx(24,22):
Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{ name: string; age: number; }'.
  No index signature with a parameter of type 'string' was found on type '{ name: string; age: number; }'.  TS7053

    22 |     const john:{name:string,age:number} = {name:'j',age:20}
    23 |     const v:string = 'name'
  > 24 |     const johnName = john[v]
       |                      ^
    25 |     return (
    26 |       <button className="square" onClick={this.props.onClick}>
    27 |         {johnName}
```

[Qiitaの記事](https://qiita.com/masarufuruya/items/d29a567d0ca4bbfb00cb)によるとこの記法で動くみたいですが、TypeScriptの場合はうまくいかないようです。
TypeScriptでこれを解決している記事も見当たらず、質問させていただいた次第です。

よろしくお願いいたします。

TypeScript : Objectのkeyに変数を用いたい

このコードの仕組みを教えてください。

- newでAlertDialogのインスタンスを作成しているのだと考えたのですがAlertDialog.classを見てみると1つのファイルの中にクラスが複数あったのでまず、その部分が理解できません。
- この部分でのthisの意味がわかりません。インスタンスがもつ変数を利用するときにthisを使うということは理解できましたが、この部分でthisはどのような意味でつかわれているのでしょうか。
- 今まで、インスタンスを作成するときは変数に代入していたのですがこのプログラムではなぜ変数に代入しなくてよいのでしょうか。

質問が多くなってしまい申し訳ありませんが、お答えいただけると助かります。なお、専門用語等もできるかぎり自分で調べるようにしておりますが、わかりやすく説明していただければと思います。

```Java
new AlertDialog.Builder(this)
                .setTitle("タイトル")
                .setMessage("メッセージ")
                .setPositiveButton("YES",null)
                .setNegativeButton("NO",null)
                .show();
```

Android Studio AlertDialogプログラムの仕組みについて

react-routerで、`/path/A`にURL直打ちでアクセスした時に`404`になってしまう対処法として、調べるとNginxの設定を
```
try_files $uri /;
```
とする方法が記載されていたので、実際に試してみると、`404`にはならなくなりました。

しかし、`/path/A`でリロードした時、もしくはURLを直打ちした時に、`/`にリダイレクト(という表現は正しくないですが)されてしまいます。

どのリンクをクリックしてもLPに飛ばされるというのは、UXとしても、SEOとしても良くないと思うので、改善したいです。

TwitterはSPAですが、URL直打ちしてもきちんと各ツイート等にリンクされますが、どのように設計すればそのようにできますか？

React-RouterでURLの直打ちに対応したい

### 前提・実現したいこと

react,reduxで無限スクロールを実装したいです。
ツイッターのクローンアプリを作成していて、ツイートを最後まで表示したら、ツイートをさらに３０件ずつ取得する関数を走らせたいです。
react-infinite-scroller
react-waypoint　
どちらのライブラリも試してみたのですが、うまくいきませんでした。
他のライブラリ等ございましたら、それでも構いません！

### 発生している問題・エラーメッセージ
一気に関数が限界まで繰り返されてしまう。
最下端まで動かしていないのに、関数が何回もトリガーされてしまう。


### 該当のソースコード

```javascipt
TweetsContainer.js

{ this.props.tweets && this.props.tweets.map(tweet => {
      return (
        <div key={tweet.tweet_id}>
         <Tweet tweet={tweet} />
        </div>
      )
})}   

{
this.props.tweets ?
<Waypoint 
onEnter={this.props.getMorePosts((this.props.tweets[this.props.tweets.length -1].created_at )} 
/>
:
null
}
```




### 試したこと

TweetsContainer　の親コンポーネントに
```javascript
TweetsContainer　の親コンポーネント

<div>
 <TweetsContainer />
 {
 this.props.tweets ?
<Waypoint 
onEnter={this.props.getMorePosts((this.props.tweets[this.props.tweets.length -1].created_at )} 
/> :
 null
 }
</div>
```
などやってみましたが、状況変わらずでした。。

Reactの無限スクロールがうまくできない。

### 前提・実現したいこと

androidアプリでfragmentを使用して画面遷移を行いたいと思っています。
この手順がよくある手法かすらまだよくわかっていないのですが、ひとつのActivityに全画面表示でFragmentを表示し、fragumentからfragmentへと表示を変えることで画面遷移を行いたいと考えています。(ActivityはMainActivityのひとつのみ）
しかし、fragmentからDialogFragmentを呼ぶと、呼び元(fragment)でダイアログの情報を取得できません。ちなみに当然ですがActivityからDialogFragmentを呼んだ場合はうまくいきます。

### 発生している問題・エラーメッセージ

```
MainActivityからnavigationを使用して、firstFragmentを表示します。
firstFragmentからボタンクリックでDatePickerDialogを表示します。
（Diarogの処理は別クラスにまとめてあります。）
表示されたDatePickerDialogで日付を選択しOKボタンをタップしても、
呼び元のfirstFragmentのoverrideメソッド（onSelected）に飛びません。
よってダイアログで日付を選択しても、テキストに表示されません。
```

### 該当のソースコード
MaimActivity.kt
```kotlin
package com.example.Test

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.navigation.Navigation
import androidx.navigation.ui.NavigationUI
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
    }
}
```
FirstFragment.kt
```kotlin
package com.example.Test

import android.os.Bundle
import android.text.format.DateFormat
import androidx.fragment.app.Fragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.navigation.Navigation
import kotlinx.android.synthetic.main.fragment_first.*
import java.util.*

class FirstFragment: Fragment() {

    override fun onSelected(year: Int, month: Int, date: Int) {
        val c = Calendar.getInstance()
        c.set(year, month, date)
        txtDate.text = DateFormat.format("yyyy/MM/dd", c)
    }

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_first, container, false)
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        btnShowDialog.setOnClickListener {
            val dialog = DatePickerFragment()

            dialog.show(fragmentManager, "日付")
        }
    }
 }
```
Dialogs.kt
```kotlin
package com.example.Test

import android.app.DatePickerDialog
import android.app.Dialog
import android.content.Context
import android.os.Bundle
import android.widget.DatePicker
import androidx.fragment.app.DialogFragment
import java.util.*

class DatePickerFragment  : DialogFragment(), DatePickerDialog.OnDateSetListener
{
    interface  OnDateSelectedListener {
        fun onSelected (year: Int, month: Int, date: Int)
    }

    private var listener: OnDateSelectedListener? = null

     override fun onAttach(context: Context?) {
        super.onAttach(context)
        when(context){
            is OnDateSelectedListener -> listener = context
        }
    }

    override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
        val c = Calendar.getInstance()
        val year = c.get(Calendar.YEAR)
        val month = c.get(Calendar.MONTH)
        val date = c.get(Calendar.DAY_OF_MONTH)

        return DatePickerDialog(requireActivity(), this, year, month, date)
    }
    override fun onDateSet(view: DatePicker?, year: Int,
        month: Int, date: Int) {
        listener?.onSelected(year, month, date)
    }
}
```
```
### 試したこと

DiarogFragmentのonAttachで渡ってくるcontextがMainActivityになっていました。
ここが原因でしょうか・・・？
この質問自体がすでにものすごく初歩的なものかもしれませんが
どなたかアドバイスいただけると大変助かります。

### 補足情報（FW/ツールのバージョンなど）
Android Studio 3.4.1
SDK 29
kotlin

androidでfragmentからDialogFragmentを呼んだ場合、戻り値が取れません

Anaconda/JupyterNotebookを使用しております｡

```ここに言語を入力
class Msg:
    pass

msg=Msg

msg

_main__.Msg
``` 
この際の出力､_main__は､何が表現されているのでしょうか｡
基本的に質問にて失礼｡解説いただけると幸いであります｡

__main__とは?

### 前提・実現したいこと
javascript（Puppeteer）で、クローラーを開発しています。
ヘッドレスブラウザ でページャーをクリックして、
次のページに遷移させたいのですが、方法がわからず困っています。


### 発生している問題・エラーメッセージ
<li class="current">が開いているページのページャーです。
「currentの次にあたる<li>をクリックして、次のページを開く」を繰り返し、
currentの次にあたる<li>が無くなったら処理を終了させたいです。

```

<ul class="pageJump">
 <li class="current"><a href="javascript: void(0);">1</a></li> 
 <li ><a href="javascript: void(0);">2</a></li> 
 <li ><a href="javascript: void(0);">3</a></li>
 <li ><a href="javascript: void(0);">4</a></li>
 <li><a href="javascript: void(0);">&gt;</a></li>
</ul>


<ul class="pageJump">
　<li><a href="javascript: void(0);">&lt;</a></li>
　<li ><a href="javascript: void(0);">1</a></li>
　<li class="current"><a href="javascript: void(0);">2</a></li> 
　<li ><a href="javascript: void(0);">3</a></li> 
　<li ><a href="javascript: void(0);">4</a></li>
　<li><a href="javascript: void(0);">&gt;</a></li>
</ul>


<ul class="pageJump">
　<li><a href="javascript: void(0);">&lt;</a></li>
　<li ><a href="javascript: void(0);">2</a></li>
　<li ><a href="javascript: void(0);">3</a></li>
　<li ><a href="javascript: void(0);">4</a></li>
　<li class="current"><a href="javascript: void(0);">5</a></li> 
</ul>
```
![イメージ説明](5e4e59c78fc65e44d94ab7b729d5baec.jpeg)


### 該当のソースコード

```Javascript（puppeteer）
await page.click('ul li.current');
```
これで「current」はクリックできるのですが、
「currentの次の<li>をクリックする」方法がわからず困っています。
お分かりになる方、ご教授頂けると幸いです。

指定クラスの次にある<li>をクリックする方法

Reduxを勉強していると、actionのファイルに下記のような記法が出てくることがあります。

```
import uuid from 'uuid';
export const addTask = (
	{
      contents = '',
      is_finished = false
	} = {}
) => ({
	type: 'ADD_TASK',
	payload: {
      id: uuid(),
      contents,
      is_finished
	}
})



```

この記法の意味がよくわかりません・。
自分としては、最初の
```
{
      contents = '',
      is_finished = false
} = {}
```
はactionに含まれるvalueの初期値であり、
その下段の
```
) => ({
	type: 'ADD_TASK',
	payload: {
      id: uuid(),
      contents,
      is_finished
	}


```
が実際にreducerに飛ばす、パラメータの形だと考えています。

それで正しいでしょうか。

また、
```
{
      contents = '',
      is_finished = false
} = {}


```
の中にある
```
{} = {}
```
とはなんでしょうか。

以上二点です。

何卒よろしくお願いします。

Reduxのactionにおける記法について

### 前提・実現したいこと
android studio でdialogflagmentの中にspinnerを入れて値を取得したいのですがthisの部分にエラーが出て先に進めませんどなたか解決法を教えていただけると幸いです。




### 該当のソースコード(この部分にエラーが出ています）
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_spinner_item, list);
        // ドロップダウンのレイアウトを指定

```ここに言語名を入力
public class CustomDialogFlagment extends DialogFragment{
    EditText editText1;
    Spinner spinner1;


    ArrayAdapter<String> adapter;


    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState){


        ArrayList<String> list = new ArrayList<String>();
        // Listにデータを入れる
        list.add("りゅう");
        list.add("へび");
        list.add("うま");
        list.add("ひつじ");

        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_spinner_item, list);
        // ドロップダウンのレイアウトを指定
        adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);




        Dialog dialog = new Dialog(getActivity());
        dialog.getWindow().requestFeature(Window.FEATURE_NO_TITLE);
        dialog.setContentView(R.layout.dialog);
        dialog.getWindow().setLayout(WindowManager.LayoutParams.FILL_PARENT, WindowManager.LayoutParams.WRAP_CONTENT);
       
        editText1 = (EditText)(dialog.findViewById(R.id.edittext1));



        spinner1 = (Spinner)(dialog.findViewById(R.id.spinner1));
        spinner1.setAdapter(adapter);

        



        dialog.findViewById(R.id.button1).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                String text = editText1.getText().toString();
                MainActivity mainActivity = (MainActivity) getActivity();
                mainActivity.setTextView12(text);
                mainActivity.saveData12(text);


                dismiss();
            }
        });

        dialog.findViewById(R.id.button2).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                dismiss();

            }
        });

        return dialog;
    }


```


### dialog.xml

<LinearLayout
        android:id="@+id/alertdialog_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="61dp"
                android:text="登録画面でさ"
                android:textSize="36sp" />

            <EditText
                android:id="@+id/edittext1"
                android:layout_width="match_parent"
                android:layout_height="82dp"
                android:hint="時間割を入力してくだちい" />

            <TextView
                android:id="@+id/textView1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="背景色を選んでください" />

            <Spinner
                android:id="@+id/spinner1"
                android:layout_width="match_parent"
                android:layout_height="48dp"
                android:entries="@array/list"
                android:prompt="@string/Prompt" />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="horizontal">

                <Button
                    android:id="@+id/button2"
                    android:layout_width="0dp"
                    android:layout_height="70dp"
                    android:layout_weight="1"
                    android:text="Cansel" />

                <Button
                    android:id="@+id/button1"
                    android:layout_width="0dp"
                    android:layout_height="70dp"
                    android:layout_weight="1"
                    android:text="決定" />
            </LinearLayout>

        </LinearLayout>


    </LinearLayout>

Android Studio のDialogFlagmentにSpinnerを入れて値を取得したいです

androidstudioで文章を出したいのですが刃や紙などの漢字の表示がおかしな文字になってしまいます。
具体的に言うと刃はなぜか刀の隣に並行した線が出るようになり、糸へんの舌の部分がレンガの様になってしまうのです。
どうすれば普通の文字が出てきてくれるのでしょうか？できれば教科書体の様に跳ねるやはらうができればいいのですが…

追記
申し訳ありませんでした、androidstudioのエミュレーターの様々な機種で試してみたのですが
何故か「刃紙」という文字が以下のように普通に書くのと違うように書かれてしまうのです



![イメージ説明](55381fb5b276cc430766fb9ab1bee078.png)
普通に刃や紙を最低でも以下の様に
![イメージ説明](332cd2cdd0cb65c25562d7692b2a9c7c.png)
理想では以下のようにしたいのです
![イメージ説明](cea37c615f0d261bc3ad02db3469b39d.png)


自分でもフォントを試したりしてみたのですが漢字を使っているフォントがどれなのかわかりませんでした。
ダウンロードをしたフォントに変更する方法のwebページも見てみたのですが
今のとバージョンが違うのか「settings」内にページで描かれていた項目が無かったんです。
使っているバージョンは「androidstudio3.4.1」でJavaを使っています

どうかよろしくお願いします。

再追記

申し訳ありません矛盾しているような文章を書いてしまいました。
自力で調べた内容を書いたのですが、
恐らく私の理解力が無かったせいで間違った内容の話になっているのだと思います。
エミュレータ上で表示する文字のフォントの話で、制作したアプリ上の話です。
具体的に言うと制作したアプリで表示する文章の中の一部の漢字がおかしな書き方になっているのを修正したいんです。
フォント設定でもその他でも手段は問いませんのでよろしくお願いします。

androidstudioの実機のプレビュー画面で普通の漢字を使う方法を教えてください

以下のようなAPIがあると仮定します。

- データベースに1000種類のデータがあり、インデックスはそれぞれ1〜1000です。
- 次のようなgetリクエストを送ることでjsonファイルを取得することができます。
　https://example.test/getJson?beginIndex=400&endIndex=500
　この場合、インデックス400〜500のデータが格納されたjsonファイルを受け取ることになります。
- しかし、一度に指定できるデータの数は100種類のみとします。
　そのため、100〜500などのリクエストはエラーが返ってきます。

以上のAPIを使い、1〜1000のデータをすべて取得したいとき、fetchを使ってどのように書けばよいでしょうか。
async/await(非同期処理)について理解が浅いため、以下のようにコードを書いてみたのですが思ったとおりの動作をしてくれません。(分かる人が見れば当然なのかもしれませんが...)

```JavaScript
const URL = "https://example.test/getJson?";

for(i = 1; i < 1000; i+=100){
  fetch(URL + "beginIndex=" + i + "&endIndex=" + (i+99))
  .then(response => response.json())
  .then(function(json){
    console.log(json);
  })
  .catch(error => {
    console.log(error);
  });
}
```

1〜1000を100ずつ10回取得することで実装しようと考えておりますが、具体的にどうすれば思ったとおりの動作をしてくれるかご教授いただけたらと思います。

追記:
7行目のconsole.logの結果を見ると、undefined を出力していました。
おそらくresponseを待たずに次のループに入っているからだと思うのですが、具体的な解決策が分かりません。
期待する動作は、
1-100でリクエストを送信→レスポンスを受け取り後、次は101-200でリクエストを送信...
これを901-1000まで繰り返したいです。
送信→受け取り→次のループ処理→送信... とするためには、安直にループで囲むだけでは難しいでしょうか。

JavaScript fetchをループで実行したい

長文すみません。
react-redux-routerを勉強しているのですが、どのサンプルを入力しても同様のエラーが出て何か基本的な所で躓いているようなのですが解決できずに困っています。
ご指導いただけないでしょうか?


- WSL ubuntu 18.04
- yarn 1.13.0
- npm 6.4.1

`yarn add redux react-redux redux-thunk redux-logger react-router-dom react-router-redux@next history --dev`
__↓ インストール直後のpackage.jsonです__
```JavaScript
{
  "name": "my-project",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-scripts": "2.1.3"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "devDependencies": {
    "history": "^4.7.2",
    "react-redux": "^6.0.0",
    "react-router-dom": "^4.3.1",
    "react-router-redux": "^5.0.0-alpha.9",
    "redux": "^4.0.1",
    "redux-logger": "^3.0.6",
    "redux-thunk": "^2.3.0"
  }
}
```
この後、fetch-jsonpとqsをインストールしています。

翔泳社のReact入門の[サンプル](https://www.shoeisha.co.jp/book/detail/9784798153353#download)を入力するとエラーとなって実行できません。


以下import等端折ったソースです。


__↓ src/index.js __
```JavaScript
const history = createBrowserHistory();
const store = createStore(history);

ReactDOM.render(
  <Provider store={store}>
    <ConnectedRouter history={history}>
      <App />
    </ConnectedRouter>
  </Provider>,
  document.getElementById('root')
);

```
__↓ src/components/Nav.js 及び src/components/Ranking.js __
```JavaScript
//Nav.js
export default function Nav({ categories }) {
  const to = category => (
    category.id === '1' ? '/all' : `/category/${category.id}`
  );

  return (
    <ul>
      {categories.map(category => (
        <li key={`nav-item-${category.id}`}>
          <Link to={to(category)}>
            {category.name}
          </Link>
        </li>
      ))}
    </ul>
  );
}
Nav.propTypes = {
  categories: PropTypes.arrayOf(
    PropTypes.shape({
      id: PropTypes.string.isRequired,
      name: PropTypes.string.isRequired
    })
  ).isRequired
};


//Ranking.js
export default class Ranking extends React.Component {
  componentWillMount() {
    this.props.onMount(this.props.categoryId);
  }
  componentWillReceiveProps(nextProps) {
    if (this.props.categoryId !== nextProps.categoryId) {
      this.props.onUpdate(nextProps.categoryId);
    }
  }

  render() {
    const { category, ranking, error } = this.props;

    return (
      <div>
        <h2>{
          typeof category !== 'undefined' ? `${category.name}のランキング` : ''
        }</h2>

        {(() => {
          if (error) {
            return <p>エラーが発生しました。リロードしてください。</p>;
          } else if (typeof ranking === 'undefined') {
            return <p>読み込み中...</p>;
          } else {
            return (
              <ol>
                {ranking.map(item => (
                  <li key={`ranking-item-${item.code}`}>
                    <img alt={item.name} src={item.imageUrl} />
                    <a href={item.url} target="_blank">{item.name}</a>
                  </li>
                ))}
              </ol>
            );
          }
        })()}
      </div>
    );
  }
}
Ranking.propTypes = {
  categoryId: PropTypes.string.isRequired,
  onMount: PropTypes.func.isRequired,
  onUpdate: PropTypes.func.isRequired,

  category: PropTypes.shape({
    id: PropTypes.string.isRequired,
    name: PropTypes.string.isRequired,
  }),
  ranking: PropTypes.arrayOf(
    PropTypes.shape({
      code: PropTypes.string.isRequired,
      name: PropTypes.string.isRequired,
      url: PropTypes.string.isRequired,
      imageUrl: PropTypes.string.isRequired,
    })
  ),
  error: PropTypes.bool.isRequired
};
Ranking.defaultProps = {
    categoryId: '1'
};

```
__↓ src/containers/Nav.js 及び src/containers/Ranking.js __
```JavaScript
//Nav.js
const mapStateToProps = state => ({
  categories: state.shopping.categories
});
export default connect(mapStateToProps)(Nav);


//Ranking.js
const mapStateToProps = (state, ownProps) => ({
  categoryId: ownProps.categoryId,

  category: state.Ranking.category,
  ranking: state.Ranking.ranking,
  error: state.Ranking.error
});

const mapDispatchToProps = dispatch => ({
  onMount (categoryId) {
    dispatch(actions.fetchRanking(categoryId));
  },
  onUpdate (categoryId) {
    dispatch(actions.fetchRanking(categoryId));
  }
});
export default connect(mapStateToProps, mapDispatchToProps)(Ranking);
```

__↓ src/reducers/index.js、src/reducers/Ranking.js 及び src/reducers/shopping.js  __
```JavaScript
//index.js
export { default as shopping } from './shopping';
export { default as Ranking } from './Ranking';

//Ranking.js
const getRanking = response => {
  const ranking = [];
  const itemLength = response.ResultSet.totalResultsReturned
  for (let index = 0; index < itemLength; index++) {
    const item = response.ResultSet['0'].Result[index + ''];
    ranking.push({
      code: item.Code,
      name: item.Name,
      url: item.Url,
      imageUrl: item.Image.Medium
    })
  }
  return ranking;
};

const initialState = {
  category: undefined,
  ranking: undefined,
  error: false
};

export default (state = initialState, action) => {
  switch (action.type) {
    case 'START_REQUEST':
      return {
        category: action.payload.category,
        ranking: undefined,
        error: false
      };

    case 'RECEIVE_DATA':
      return action.payload.error
        ? { ...state, error: true }
        : { ...state, ranking: getRanking(action.payload.response) };

    default:
      return state;
  }
}

//shopping.js
const initialState = {
  categories: [
    { id: '1', name: 'すべてのカテゴリ' },
    { id: '2502', name: 'パソコン、周辺機器' },
    { id: '10002', name: '本、雑誌、コミック' }
  ]
};
export default () => initialState;
```
__↓ src/actions/Ranking.js __
```JavaScript
const API_URL = 'yahooのAPIリクエストURL';
const APP_ID = '自分がyahooで取得したID';

const startRequest = category => ({
  type: 'START_REQUEST',
  payload: { category },
});
const receiveData = (category, error, response) => ({
  type: 'RECEIVE_DATA',
  payload: { category, error, response },
});
const finishRequest = category => ({
  type: 'FINISH_REQUEST',
  payload: { category },
});

// ランキングを取得する
export const fetchRanking = categoryId => {
  return async (dispatch, getState) => {
    const categories = getState().shopping.categories;
    const category = categories.find(category => (category.id === categoryId));
    if (typeof category === 'undefined') {
      dispatch(replace('/'));
      return;
    }
    dispatch(startRequest(category));

    const queryString = qs.stringify({
      appid: APP_ID,
      category_id: categoryId,
    });
    try {
      const responce = await fetchJsonp(`${API_URL}?${queryString}`);
      const data = await responce.json();
      dispatch(receiveData(category, null, data));
    } catch (err) {
      dispatch(receiveData(category, err));
    }
    dispatch(finishRequest(category));
  };
};

```
__ ↓ src/createStore.js __
```JavaScript
export default function createStore(history) {
  return reduxCreateStore(
    combineReducers({
      ...reducers,
      router: routerReducer,
    }),
    applyMiddleware(
      logger,
      thunk,
      routerMiddleware(history)
    )
  );
}
```

__ ↓ src/fetchRanking.js __
```JavaScript
const API_URL = 'yahooのAPIリクエストURL';
const APP_ID = '自分がyahooで取得したID';

export default function fetchRanking(categoryId) {
  const queryString = qs({
    appid: APP_ID,
    category_id: categoryId
  });
  return fetchJsonp(`${API_URL}?${qs}`);
}
```

__ ↓ src/App.js __
```JavaScript
class App extends Component {
  render() {
    return (
      <div className="App">
        <Nav />
        <Switch>
          <Route path="/all" component={Ranking} />
          <Route
            path="/category/1"
            render={() => <Redirect to="/all" />}
          />
          <Route
            path="/category/:id"
            render={
              ({ match }) => <Ranking categoryId={match.params.id} />
            }
          />
        </Switch>
      </div>
    );
  }
}
export default App;
```

__ ↓ src/index.js[エントリーポイント] __
```JavaScript
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { ConnectedRouter } from 'react-router-redux';
import createBrowserHistory from 'history/createBrowserHistory';
import App from './App';
import createStore from './createStore';

const history = createBrowserHistory();
const store = createStore(history);

ReactDOM.render(
  <Provider store={store}>
    <ConnectedRouter history={history}>
      <App />
    </ConnectedRouter>
  </Provider>,
  document.getElementById('root')
);
```

実行結果は
** TypeError: Cannot read property 'dispatch' of undefined **
となります。

プラウザコンソールのデバッガで追いかけたりしたのですが自己解決できそうにありません。
よろしくお願いします・

この[サイト](https://windii.jp/react/react-router-redux-tutorial)のサンプルでも同様のエラーが出ます。

react-redux-router,ConnectedRouterでエラー、"TypeError: Cannot read property 'dispatch' of undefined"

for文でのconstとletについていくつか質問があります。
```Javascript
const characters = [
  	 {name: "田中", age: 14},
  	 {name: "佐藤", age: 100},
  	 {name: "久保", age: 5},
  	 {name: "飯田", age: 19}
	];

for (let i = 0; i < characters.length; i++) {
 
     const character = characters[i];
     console.log(`${character.name}`);
	
}
```

上記のコードのループを疑似的に書くと以下のようになります。
```JavaScript
          //1回目のループ
	   { 
   	    const character = characters[i];
   	    console.log(`${character.name}`);
	   }
	  
	   //2回目のループ
	   { 
   	    const character = characters[i];
   	    console.log(`${character.name}`);
	   }

	     //3回目のループ
	   { 
   	    const character = characters[i];
   	    console.log(`${character.name}`);
	   }
           
```
ここで質問があります。
インクリメントされる変数iはどこでインクリメントされるのでしょうか。
ループのたびに生成する別々のブロックの内部でインクリメントされるのでしょうか。
constがインクリメントできない理由は、ループのたびに生成する別々のブロックの外部でインクリメントするための変数iを定義するため,
ブロック内部で定義できるconst character = characters[i];　のように動かないのでしょうか。

よろしくお願いします。

constがインクリメントできない理由

PCスペック
Windows10 HOME 64bit
メモリ　32GB
プロセッサ　Intel Core i7-8700CPU 3.20GHz
Android Studio 3.4.1(最新ver)
デモ用端末(XPERIA OS:7.0 API 24)

お世話になっております。
通常の矩形であれば、４点の座標が分かれば取得が可能ですが、指でなぞったような矩形とは言えないオブジェクトを座標として取得するにはどんな方法がありますでしょうか？

Android なぞった部分の座標の取得方法

現在、javaでandroidアプリを作ろうとしています。
その中で、どうしてもcontextの解釈にしっくり来ません。

私の感覚的には、contextとはactivityの入れ物で、contextの中には様々な情報が入っている。
そして、それらを移行先の画面に受け渡す。

の、ようなイメージなのですが、具体的にcontextの中に入っている情報の中身がよくわかりません。

どなたか教えていただきたいです。