JavaScript

2021.06.12

promiseのcatchのコールバック関数の戻り値をawaitで受け取る

'use strict';

const p = console.log;

const timeoutPromise = ({ ms, func, arg }) => {
  return new Promise((resolve, reject) => {
    if (20 === ms) {
      reject(`${ms}ミリ秒はエラーです!!`);
    }
    setTimeout(() => {
      resolve(func(arg));
    }, ms);
  }).catch((a) => a);
};

const createArg = ({ ms }) => ({ ms, func: () => `${ms}ミリ秒待ちました。` });

(async () => {
  /* promiseのcatchのコールバック関数の戻り値をawaitで受け取る */
  p(await timeoutPromise(createArg({ ms: 21 })));
  p(await timeoutPromise(createArg({ ms: 20 })));
  p(await timeoutPromise(createArg({ ms: 19 })));
})();

'use strict';

const p = console.log;

const timeoutPromise = ({ ms, func, arg }) => {

return new Promise((resolve, reject) => {

if (20 === ms) {

reject(`${ms}ミリ秒はエラーです!!`);

}

setTimeout(() => {

resolve(func(arg));

}, ms);

}).catch((a) => a);

};

const createArg = ({ ms }) => ({ ms, func: () => `${ms}ミリ秒待ちました。` });

(async () => {

/* promiseのcatchのコールバック関数の戻り値をawaitで受け取る */

p(await timeoutPromise(createArg({ ms: 21 })));

p(await timeoutPromise(createArg({ ms: 20 })));

p(await timeoutPromise(createArg({ ms: 19 })));

})();

21ミリ秒待ちました。
20ミリ秒はエラーです!!
19ミリ秒待ちました。

21ミリ秒待ちました。

20ミリ秒はエラーです!!

19ミリ秒待ちました。

2021.05.28

JavaScriptのオブジェクトに使える自作のeach関数の練習

'use strict';

const p = console.log;

/** callback(value, key, obj) */
const each = (obj, callback) => {
  const ret = [];
  for (const key of Object.keys(obj)) {
    const value = obj[key];
    ret.push(callback(value, key, obj));
  }
  return ret;
};

const obj = {
  名前: 'taro',
  苗字: '田中',
  age: 27,
};
const ret = each(obj, (v, k) => `${k}: ${v}`);

ret.forEach((v) => p(v));

'use strict';

const p = console.log;

/** callback(value, key, obj) */

const each = (obj, callback) => {

const ret = [];

for (const key of Object.keys(obj)) {

const value = obj[key];

ret.push(callback(value, key, obj));

}

return ret;

};

const obj = {

名前: 'taro',

苗字: '田中',

age: 27,

};

const ret = each(obj, (v, k) => `${k}: ${v}`);

ret.forEach((v) => p(v));

名前: taro
苗字: 田中
age: 27

名前: taro

苗字: 田中

age: 27

2021.05.25

実行順を守りたいが互いに依存しない非同期関数にはPromise.all()を使うべきである

async-await だと1つずつ完了を待ってしまうが、
Promise.all()は一斉に(疑似的に並列に)処理する。

'use strict';

const sleepXXms = (ms) => {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve(`${ms}ms待ちました`);
    }, ms);
  });
};
const sleep10ms = () => sleepXXms(10);
const sleep20ms = () => sleepXXms(20);
const sleep30ms = () => sleepXXms(30);

const calcRunTimeMs = async (targetFunc) => {
  const start = new Date();
  const result = await targetFunc();
  const lapseMs = new Date() - start;
  return { lapseMs, result };
};

const targetFuncA = async () => {
  return [await sleep20ms(), await sleep10ms(), await sleep30ms()];
};
const targetFuncB = async () => {
  return await Promise.all([sleep20ms(), sleep10ms(), sleep30ms()]);
};

(async () => {
  console.log(await calcRunTimeMs(targetFuncA));
  console.log(await calcRunTimeMs(targetFuncB));
})();

'use strict';

const sleepXXms = (ms) => {

return new Promise((resolve) => {

setTimeout(() => {

resolve(`${ms}ms待ちました`);

}, ms);

});

};

const sleep10ms = () => sleepXXms(10);

const sleep20ms = () => sleepXXms(20);

const sleep30ms = () => sleepXXms(30);

const calcRunTimeMs = async (targetFunc) => {

const start = new Date();

const result = await targetFunc();

const lapseMs = new Date() - start;

return { lapseMs, result };

};

const targetFuncA = async () => {

return [await sleep20ms(), await sleep10ms(), await sleep30ms()];

};

const targetFuncB = async () => {

return await Promise.all([sleep20ms(), sleep10ms(), sleep30ms()]);

};

(async () => {

console.log(await calcRunTimeMs(targetFuncA));

console.log(await calcRunTimeMs(targetFuncB));

})();

{ lapseMs: 61, result: [ '20ms待ちました', '10ms待ちました', '30ms待ちました' ] }
{ lapseMs: 31, result: [ '20ms待ちました', '10ms待ちました', '30ms待ちました' ] }

1 2	{ lapseMs: 61, result: [ '20ms待ちました', '10ms待ちました', '30ms待ちました' ] } { lapseMs: 31, result: [ '20ms待ちました', '10ms待ちました', '30ms待ちました' ] }

2021.04.03

GASで特定の行をグレーに塗る

/**
 * myFunction を実行すると sheetName 内の keywords を含む行をグレーに塗る
 */
const id = 'xxxxxx-xxxxxxxxx_11111-XXXXXXXXXXXXXXXXXXXXX';
const sheetName = 'シート1';
const keywords = ['ホゲギンコウ', 'フガカンパニー'];

const 指定した行を返す関数 = ({ dataRangeValues, row }) => dataRangeValues[row - 1];

const 指定した行のカラム数を返す関数 = ({ dataRangeValues, row }) => 指定した行を返す関数({ dataRangeValues, row }).length;

const 指定した行を色付けする関数 = ({ sheet, dataRangeValues, row, color = '#C0C0C0' }) => {
  const カラム数 = 指定した行のカラム数を返す関数({ dataRangeValues, row });
  /* getRange(row, column, numRows, numColumns) */
  sheet.getRange(row, 1, 1, カラム数).setBackground(color);
};

const 文字列1が文字列2を含んでいたら真となる関数 = (文字列1, 文字列2) => 文字列1.indexOf(文字列2) !== -1;

const 行がキーワードを含んでいたら真となる関数 = ({ dataRangeValues, row, keywords }) => {
  const columns = 指定した行を返す関数({ dataRangeValues, row });
  for (const column of columns) {
    for (const keyword of keywords) {
      if (文字列1が文字列2を含んでいたら真となる関数(String(column), keyword)) {
        return true;
      }
    }
  }
  return false;
};

const キーワードをカラムに持つ行に色を塗る関数 = ({ sheet, keywords }) => {
  const dataRangeValues = sheet.getDataRange().getValues();
  for (let i = 0; i < dataRangeValues.length; i++) {
    const row = i + 1;
    if (行がキーワードを含んでいたら真となる関数({ dataRangeValues, row, keywords })) {
      指定した行を色付けする関数({ sheet, dataRangeValues, row });
    }
  }
};

const myFunction = () => {
  const sheet = SpreadsheetApp.openById(id).getSheetByName(sheetName);
  キーワードをカラムに持つ行に色を塗る関数({ sheet, keywords });
};

// 参考
// https://qiita.com/cazimayaa/items/224daebe536799e5a8a2

/**

* myFunction を実行すると sheetName 内の keywords を含む行をグレーに塗る

const id = 'xxxxxx-xxxxxxxxx_11111-XXXXXXXXXXXXXXXXXXXXX';

const sheetName = 'シート1';

const keywords = ['ホゲギンコウ', 'フガカンパニー'];

const 指定した行を返す関数 = ({ dataRangeValues, row }) => dataRangeValues[row - 1];

const 指定した行のカラム数を返す関数 = ({ dataRangeValues, row }) => 指定した行を返す関数({ dataRangeValues, row }).length;

const 指定した行を色付けする関数 = ({ sheet, dataRangeValues, row, color = '#C0C0C0' }) => {

const カラム数 = 指定した行のカラム数を返す関数({ dataRangeValues, row });

/* getRange(row, column, numRows, numColumns) */

sheet.getRange(row, 1, 1, カラム数).setBackground(color);

};

const 文字列1が文字列2を含んでいたら真となる関数 = (文字列1, 文字列2) => 文字列1.indexOf(文字列2) !== -1;

const 行がキーワードを含んでいたら真となる関数 = ({ dataRangeValues, row, keywords }) => {

const columns = 指定した行を返す関数({ dataRangeValues, row });

for (const column of columns) {

for (const keyword of keywords) {

if (文字列1が文字列2を含んでいたら真となる関数(String(column), keyword)) {

return true;

}

return false;

};

const キーワードをカラムに持つ行に色を塗る関数 = ({ sheet, keywords }) => {

const dataRangeValues = sheet.getDataRange().getValues();

for (let i = 0; i < dataRangeValues.length; i++) {

const row = i + 1;

if (行がキーワードを含んでいたら真となる関数({ dataRangeValues, row, keywords })) {

指定した行を色付けする関数({ sheet, dataRangeValues, row });

}

};

const myFunction = () => {

const sheet = SpreadsheetApp.openById(id).getSheetByName(sheetName);

キーワードをカラムに持つ行に色を塗る関数({ sheet, keywords });

};

// 参考

// https://qiita.com/cazimayaa/items/224daebe536799e5a8a2

2021.03.08

JSのfetchのresponse.json()はPromiseを返す！その対処法

'use strict';

const callApi = (url) => {
  fetch(url)
    .then(async (res) => ({
      status: res.status,
      json: await res.json(),
    }))
    .then(console.log);
};

callApi('https://www.jma.go.jp/bosai/forecast/data/overview_week/130000.json');
/**
{status: 200, json: {…}}
json:
headTitle: "関東甲信地方週間天気予報"
publishingOffice: "気象庁"
reportDatetime: "2021-03-08T10:35:00+09:00"
text: "予報期間　３月９日から３月１５日まで↵　向こう一週間は、期間のはじめと終わりに晴れる日もありますが、期間の中頃は気圧の谷や湿った空気の影響で雲が広がりやすく、雨の降る日があるでしょう。↵　最高気温は、平年より高い日が多く、期間のはじめと終わりは平年よりかなり高い日もある見込みです。最低気温は、平年より高い日が多く、期間の後半は平年よりかなり高い日もあるでしょう。↵　降水量は、平年並か平年より多い見込みです。"
__proto__: Object
status: 200
__proto__: Object
 */

'use strict';

const callApi = (url) => {

fetch(url)

.then(async (res) => ({

status: res.status,

json: await res.json(),

}))

.then(console.log);

};

callApi('https://www.jma.go.jp/bosai/forecast/data/overview_week/130000.json');

/**

{status: 200, json: {…}}

json:

headTitle: "関東甲信地方週間天気予報"

publishingOffice: "気象庁"

reportDatetime: "2021-03-08T10:35:00+09:00"

text: "予報期間　３月９日から３月１５日まで↵　向こう一週間は、期間のはじめと終わりに晴れる日もありますが、期間の中頃は気圧の谷や湿った空気の影響で雲が広がりやすく、雨の降る日があるでしょう。↵　最高気温は、平年より高い日が多く、期間のはじめと終わりは平年よりかなり高い日もある見込みです。最低気温は、平年より高い日が多く、期間の後半は平年よりかなり高い日もあるでしょう。↵　降水量は、平年並か平年より多い見込みです。"

__proto__: Object

status: 200

__proto__: Object

2021.03.05

generator関数をラムダに閉じ込める意味はあるのか不明

'use strict';

const myGenerator = () => (function* () {
  yield '私の';
  yield '名前';
  yield 'は';
  yield '太郎デス';
})();

for (const v of myGenerator()) {
  console.log(v);
}

'use strict';

const myGenerator = () => (function* () {

yield '私の';

yield '名前';

yield 'は';

yield '太郎デス';

})();

for (const v of myGenerator()) {

console.log(v);

}

私の
名前
は
太郎デス

私の

名前

は

太郎デス

12 3 4 5

JavaScript

promiseのcatchのコールバック関数の戻り値をawaitで受け取る

JavaScriptのオブジェクトに使える自作のeach関数の練習

dockerでnodejsを実行するコマンド

JavaScriptでコールバックの練習

JavaScriptでquicksort(ひさびさ)

高階関数に高階関数を渡す

実行順を守りたいが互いに依存しない非同期関数にはPromise.all()を使うべきである

GASで特定の行をグレーに塗る

JSのfetchのresponse.json()はPromiseを返す！その対処法

generator関数をラムダに閉じ込める意味はあるのか不明

最近の投稿

サイトマップ

カテゴリー

アーカイブ

人気の投稿とページ

Twitter