JavaScriptは、現代のウェブ開発に不可欠な言語です。本記事では、JavaScriptの主要な構文を簡潔にまとめ、各項目に簡単な説明を加えています。初心者の方の学習補助として、また経験者の方の復習やクイックリファレンスとして活用いただけます。JavaScriptの基本から応用まで、必要な情報を素早く参照できるよう構成しています。
変数宣言
変数は値を格納するための入れ物です。JavaScriptでは、let、const、varを使用して変数を宣言します。
let x = 5; // 再代入可能な変数 const PI = 3.14; // 定数(再代入不可) var oldWay = 'old'; // 古い宣言方法(非推奨)
データ型
JavaScriptには様々なデータ型があり、それぞれ異なる種類の値を表現します。
let num = 42; // 数値 let str = "Hello"; // 文字列 let bool = true; // 真偽値 let arr = [1, 2, 3]; // 配列 let obj = {name: "John"}; // オブジェクト let nul = null; // null let undef = undefined; // undefined
条件分岐
条件分岐を使用すると、特定の条件に基づいて異なるコードブロックを実行できます。
if (条件1) { // 処理 } else if (条件2) { // 別の処理 } else { // それ以外の処理 } // 三項演算子 let result = condition ? "真" : "偽";
ループ
ループを使用すると、同じコードブロックを繰り返し実行できます。
for (let i = 0; i < 5; i++) { // 処理 } while (条件) { // 処理 } do { // 処理 } while (条件); for (let item of array) { // 配列の要素に対する処理 } for (let key in object) { // オブジェクトのプロパティに対する処理 }
関数
関数は再利用可能なコードブロックで、特定のタスクを実行するために使用されます。
function greet(name) { return `Hello, ${name}!`; } // アロー関数 const greet = (name) => `Hello, ${name}!`; // デフォルト引数 function greet(name = "Guest") { return `Hello, ${name}!`; }
配列操作
配列は複数の値を順序付けて格納するためのデータ構造です。JavaScriptには配列を操作するための多くのメソッドがあります。
let arr = [1, 2, 3]; arr.push(4); // 末尾に追加 arr.pop(); // 末尾から削除 arr.unshift(0); // 先頭に追加 arr.shift(); // 先頭から削除 let newArr = arr.slice(1, 3); // 部分配列の取得 arr.forEach(item => console.log(item)); // 各要素に対する処理 let mapped = arr.map(x => x * 2); // 各要素を変換 let filtered = arr.filter(x => x > 2); // 条件に合う要素のみ抽出
オブジェクト
オブジェクトは、関連するデータと機能をグループ化するために使用されます。
let person = { name: "Alice", age: 30, greet: function() { console.log(`Hello, I'm ${this.name}`); } }; // プロパティアクセス console.log(person.name); console.log(person["age"]); // メソッド呼び出し person.greet();
ビルトインオブジェクト
JavaScriptには、多くの便利な組み込みオブジェクトが用意されています。これらのオブジェクトは、一般的な処理を簡単に実行するのに役立ちます。
// Math Math.random(); // 0以上1未満の乱数 Math.floor(3.7); // 3 (小数点以下切り捨て) // Date let now = new Date(); now.getFullYear(); // 現在の年 // String let str = "Hello, World!"; str.toLowerCase(); // "hello, world!" str.split(", "); // ["Hello", "World!"] // Array let arr = [1, 2, 3]; arr.join("-"); // "1-2-3" // Object Object.keys({a: 1, b: 2}); // ["a", "b"] // JSON JSON.stringify({name: "John"}); // '{"name":"John"}' JSON.parse('{"name":"John"}'); // {name: "John"}
クラス
クラスはオブジェクト指向プログラミングの基本的な構成要素で、オブジェクトの設計図として機能します。
class Person { constructor(name, age) { this.name = name; this.age = age; } greet() { console.log(`Hello, I'm ${this.name}`); } } let alice = new Person("Alice", 30); alice.greet();
非同期処理
非同期処理を使用すると、長時間実行される操作を待つ間に他のコードを実行できます。
// Promise let promise = new Promise((resolve, reject) => { // 非同期処理 }); // async/await async function fetchData() { try { let response = await fetch(url); let data = await response.json(); console.log(data); } catch (error) { console.error(error); } }
まとめ
このチートシートは、JavaScriptの主要な構文を簡潔にまとめたものです。実際の開発では、より詳細な情報や使用例が必要になる場合があります。JavaScriptの学習や開発の際に、このチートシートを参考にしてください。各項目の詳細な説明や使用例を理解することで、JavaScriptのスキルを向上させることができるでしょう。
