見出し画像

【ワンピースで覚えるTypeScript】第11回 コールバック関数(JavaScript学習者向け)

今回はTypeScriptのコールバック関数について説明します。

特に、コールバック関数を受け取るメソッドを用いて説明していきます。

こちら代表的なメソッドたちなので、どれも覚えておきましょう!

//コールバック関数を受けるメソッド
//①mapメソッド
type Character = { name: string, bounty: number };
const getBounty = (c: Character ) => c.bounty;

const characters = [
  { name: 'チョッパー', bounty: 1000 },
  { name: 'ベポ', bounty: 500 }
];

console.log(Characters.map(getBounty));
console.log(characters.map((c: Character) => c.bounty));

//②filterメソッド
type Character2 = { name: string, affiliation: string };
const characters2 = [
  { name: 'ルフィ', affiliation: '麦わらの一味' },
  { name: 'ゾロ', affiliation: '麦わらの一味' },
  { name: 'ナミ', affiliation: '麦わらの一味' },
  { name: 'エース', affiliation: '白ひげ海賊団' },
  { name: 'マルコ', affiliation: '白ひげ海賊団' },
  { name: 'ウソップ', affiliation: '麦わらの一味' },
  { name: 'サンジ', affiliation: '麦わらの一味' },
];

const strawhatCharacters = characters2.filter((char: Character2) => char.affiliation === '麦わらの一味');
console.log(strawhatCharacters);


//③everyメソッド
console.log(strawhatCharacters.every((char: Character2) => char.affiliation === '麦わらの一味'));
console.log(characters2.every((char: Character2) => char.affiliation === '麦わらの一味'));

//④someメソッド
console.log(characters2.some((char: Character2) => char.affiliation === '麦わらの一味'));

//⑤findメソッド
console.log(characters2.find((char: Character2) => char.affiliation === '白ひげ海賊団'));

この記事が気に入ったらサポートをしてみませんか?