0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

未経験からJavaScript学んでみたのでまとめてみた

Posted at

はじめに

こんにちは!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を理解する上での注意点について書いていきます。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?