前提
この記事はPython,C,C++がちょっとだけ書ける、読める筆者がProgateでのJS学習を通して、はえ～と思ったことをまとめたものになります。従って、なんだそれ当たり前だろみたいなことしか書かれていませんので悪しからず。
ちなみに生成AI頼りの個人開発をした際，JavaScriptを使いましたのである程度はわかっているつもりですが、自分で書かないと気づけない厳密な部分は何もわかっていないです。
記憶定着用のアウトプットに近いものになりますので、誤っている部分があれば訂正していただけると幸いです。。
筆者の技術力
- C,Python (基礎文法~ポインタ、アルゴリズムの授業、研究での使用など)
- HTML,CSS,JS (大半を生成AIに支援してもらったため読めるが書けない)
- C++ : (AtcoderのD問題をたまにギリギリ完答できる程度)
配列の操作
push
配列の末尾に値を追加する。
push
const numbers = [1,2,3];
numbers.push(4); //=>[1,2,3,4]
numbers.push("five"); //=>[1,2,3,4,"five"]
findとfilter
-
findを使うと条件と合致する最初の要素が、filterを使うとすべての要素が新しい配列として返ってくる。 - 条件と合致する要素が見つからなかった場合、
findではundefinedが、filterでは空の配列として[]が返される
findとfilter
const numbers=[1,2,3,4,5];
//find
const foundNumber = numbers.find((number) => {
return number >= 3; //=> 3
});
//filter
const foundNumbers = numbers.filter((number) => {
return number >= 3; //=> [3,4,5]
});
forEach
- 配列の各中身について、処理を行う。
- 配列の各要素に対して順次処理を行うが、新しい配列は作成しない。
- forEach関数の引数として関数が入り、これをコールバック関数と呼ぶ
forEach
numbers.forEach((number) => {console.log(number);});
map
- 配列のすべての中身に対して処理を行い、新しい配列を作る
- returnが必須
map
const numbers=[1,2,3,4,5];
const numbersPlusOne = numbers.map((number) => {
return number+1; //=> [2,3,4,5,6]
});
コールバック関数
- 関数の引数として関数を渡す。
- 渡すときは関数を参照として渡し、"()"は不要である
コールバック関数
const print = () =>{
console.log("Hello World!");
}
const call = (callback) => {
console.log("コールバック関数を実行します");
callback(); //print関数をcallback関数として実行。
}
call(print); //print関数をcall関数に渡す。()は不要
関数を直接引数に埋め込むこともできる
call(() => {
console.log("Hello World!");
});
引数のやり取り
コールバック関数がパラメータを持つ場合は、下のようにコールバック関数を渡した先の関数内で引数を指定する。
const call = (callback) => {
callback("太郎"); //引数を渡す。
}
call((name) => { //パラメータを持つコールバック関数
console.log(`私の名前は${name}です。`); //=> 私の名前は太郎です。
});
まとめ
コールバック関数の動作等に癖があり、とっつきずらいイメージがありましたが、少しは自分の中に落とし込めたのではないかと思います。
当方初学者なため、認知のずれや、モダンな開発現場ではもう使わない表現などがありましたらコメントで指摘していただけると幸いです。😸