はじめに
こんにちは!takuhuyuです。
現在実務未経験でエンジニア転職を目指しています。
今回は、プログラミング未経験でJavaScriptをこれから学びたい方向けにチートシート(的に)まとめてみました。
私のような未経験から挑戦したいという方はぜひ参考にしてみてください。
初学者向け JavaScript基礎まとめ
変数とデータ型
JavaScriptでは、変数を使ってデータを保存します。変数を定義する方法には、var、let、constがあります。
let age = 25; //数値
const name = "John"; //文字列
var isStudent = true; //ブール値
データ型には、数値、文字列、ブール値、null、undefinedなどが含まれます。
演算子と式
演算子を使うと、変数や値に対して操作ができます。
let sum = 5 + 3; // 8
条件分岐
条件分岐を使うと、特定の条件が満たされた時に異なるコードを実行できます。
if (age > 18) {
console.log("Adult");
} else {
console.log("Minor");
}
switch文も使えます。
switch(day) {
case 0:
console.log("Sunday");
break;
case 1:
console.log("Monday");
break;
// その他のケース
}
ループ(for, while, do...while)
ループを使うと、同じコードを繰り返し実行できます。
for (let i = 0; i < 5; i++) {
console.log(i);
}
関数の定義
関数は、特定のタスクを実行するためのコードのブロックです。
function greet(name) {
return "Hello, " + name;
}
console.log(greet("Alice")); // Hello, Alice
オブジェクト
オブジェクトは、関連するデータや機能をまとめるために使います。
let person = {
name: "John",
age: 30,
greet: function() {
console.log("Hello!");
}
};
配列
配列は、複数の値を格納するために使います。
let fruits = ["Apple", "Banana", "Cherry"];
console.log(fruits[0]); // Apple
fruits.push("Orange");
console.log(fruits.length); // 4
DOM操作
DOM(Document Object Model)は、HTMLの構造を表します。
HTMLから直接操作せず、JavaScriptを使って、ウェブページの要素を操作できます。
let element = document.getElementById("myElement");
element.textContent = "新しいテキスト";
イベント処理
イベント処理を使うと、ユーザーの操作に応じてコードを実行できます。
document.getElementById("myButton").addEventListener("click", function() {
alert("Button clicked!");
});
まとめ
いかがだったでしょうか?
プログラミング学んだことない方でJavaScriptを学んでみたいという方は、これを見ればだいたい基礎はおさえられると思います!
これらを使いこなすためには、とにかく簡単なアプリケーションを作ってみて、どんな時に使うのか体感してみて欲しいです!
次回は、JavaScriptを理解する上での注意点について書いていきます。