javascript promiseを使った文の意味がわからない

Question

以下のコードですが、
１点目
const [] =
の[]の表記はどのようなものでしょうか？？

２点目
const[] =promise.all(
)
とありますが
const a = new promise()
なら新しいpromiseオブジェクトを代入しているのがわかります。
また、promiseがすでにユーバーガ定義したオブジェクトならば、
promiseに対してall()というメソッドを使用したのか？と考えることもできます
そして使用した結果を代入したと解釈できます

ただpromise自体はユーザーが定義した変数ではないので、この書き方に戸惑っています。
どのような気泡でしょうか？？

const [course, { userCourse }] = await Promise.all([
      api.showCourse(courseId).catch(err => {
        this.setState({ isValidUrl: false });
        return null;
      }), 
      api.showUserCourse(uid, courseId).catch(err => {
        if (
          (err.code === "User course not found" && err.status === 404) ||
          !isLoggedIn ||
          true
        ) {
          return { userCourse: {} };
        }
      }) 
    ]);

Comments

[退会済みユーザー]

以前の丸投げ質問が未解決かつ未修正のままです。こちらの質問もpromiseのことを調べて具体的にどこまで理解しどこから分からないのかを質問文に書いて下さい。

[violineer]

すみません、不快な思いをさせているようなので消去依頼を出しました。

Answer 1

const [] =

の[]の表記はどのようなものでしょうか？？

destructuring assignment(分割代入??)というものです。

分割代入 - MDN

また、promiseがすでにユーバーガ定義したオブジェクトならば、

promiseに対してall()というメソッドを使用したのか？と考えることもできます
そして使用した結果を代入したと解釈できます

難しいことを考えなくても、Promise.all()はPromiseの配列(厳密にはiterable)を受け取ってすべてのPromiseがresolveするまで待つPromiseを返すという関数です。

Promise.all() - MDN
Promise.all() - 複数のPromise関数を実行し、全ての結果を得る | JavaScriptリファレンス

awaitを使っているということはasync function内のコードなので以下のようになっていると思いますが、

async function f() {
  const [course, {userCourse}] = await Promise.all([promise1, promise2]);
  // do something
}

これは下のコードとだいたい同じです。

function f() {
  Promise.all([promise1, promise2])
    .then(result => {
      const course = result[0]
      const userCourse = result[1].userCourse
      // do something
    })
}

async/awaitについてご存じないならこちらが参考になるでしょう。
async function - JavaScript - MDN
async/await 入門（JavaScript） - qiita

Answer 2

await Promise.allが配列を返しているので, これを変数cource, userCourceに分割代入しています.

一度にまとめるから判りにくいのですが, 要は

const [course, { userCourse }] = await Promise.all([
      api.showCourse(courseId).catch(err => {
        this.setState({ isValidUrl: false });
        return null;
      }), 
      api.showUserCourse(uid, courseId).catch(err => {
        if (
          (err.code === "User course not found" && err.status === 404) ||
          !isLoggedIn ||
          true
        ) {
          return { userCourse: {} };
        }
      }) 
    ]);

はasynd Promise.all部(Promiseの配列を配列を返すPromiseに変換する)

const result = await Promise.all([
      api.showCourse(courseId).catch(err => {
        this.setState({ isValidUrl: false });
        return null;
      }), 
      api.showUserCourse(uid, courseId).catch(err => {
        if (
          (err.code === "User course not found" && err.status === 404) ||
          !isLoggedIn ||
          true
        ) {
          return { userCourse: {} };
        }
      }) 
    ]);

と分割代入部の

const [course, { userCourse }] = result;

に分解でき, 後者は更に

const cource = result[0];
const userCource = result[1].userCource;

と書き換えられます.