♻️
JS演習 コールバック関数 ★2~3
こんばんは。今日はコールバック関数の演習です。作り方が分かれば使い方もより一層わかると思います。
処理の反復 ★★☆☆☆
シンプルなコールバック関数です。関数を繰り返してください。
function
repeat(関数, 回数);// 回数分だけ関数を実行
// ここにコードを書いてね。
repeat(() => {
console.log('JS');
}, 3);// > 'JS' 'JS' 'JS'
repeat(function() {
console.log('うさぎ');
}, 0);// なし
ヒント コールバック関数とは
引数に関数を入れる関数のことです。[].forEach()
なんかもコールバック関数です。
function callTwice(func) {
func();
func();
}
callTwice(() => {
console.log('abc');
});// > 'abc' 'abc'
仕組み
func = () => {
console.log('abc');
};
func();// > 'abc'
func();// > 'abc'
オブジェクトでforEach ★★★☆☆
コード自体は短く簡単ですが、混乱します。this
の処理はしなくてもいいです。するなら頑張ってください。
このコードは練習目的です。実際は変わりに配列やMapオブジェクトを使ってください。
const obj = {
prop1: 7,
prop2: 12,
prop3: 2
};
// ここにコードを書いてね。
let sum = 0;
obj.forEach(value => {
sum += value;
});
console.log(sum);// > 21
obj.forEach((val, key, obj) => {
obj[key] = val + key;
});
console.log(obj);
// > { prop1: '7prop1', prop2: '12prop2', prop3: '2prop3' }
ヒント 引数ありのコールバック関数
引数ありコールバックの使い方と作り方はこんな感じです。
let flag, message, password;
function check(func) {
if (flag) {
func(message, password);
} else {
console.error('flagがfalseです。');
}
}
flag = true;
message = '3201';
password = 'Sc2J1xBe';
check((val, pass) => {
console.log(`メッセージ: ${val}`);// > メッセージ: 3201
console.log(`パスワード: ${pass}`);// > パスワード: Sc2J1xBe
});
Discussion