JavaScript - 変数

こんにちは、将来のコードのスーパースター!? 楽しいJavaScriptの変数の世界への旅へようこそ。あなたの近所の親切なコンピュータサイエンスの先生として、この基本的な概念をガイドするのを楽しみにしています。で、仮想の思考帽をかぶり、一緒に潜りましょう!

JavaScript - Variables

JavaScriptの変数

パーティを計画していると imagine してみてください(誰だって、いいコードのパーティが好きですよね?)。すべての重要な情報を保管する場所が必要です - たとえば、どれだけのピザを注文するか、誰が来るか、どんなゲームをするかなど。JavaScriptでは、変数はパーティの計画のための保管容器のようなものです。プログラムが動作するために必要なデータを保持します。

簡単な例から始めましょう:

let partyGuests = 10;

ここでは、partyGuestsという変数を作成し、値10を割り当てています。これが、\"10人のゲストが来る\"とメモを書くようなものです。

JavaScriptにおける変数の宣言

では、実際にこれらの変数を作成する方法について話しましょう。JavaScriptには、変数を宣言する3つの方法があります:

  1. var - オールドスクールの方法(まだ動作しますが、いくつかのクセがあります)
  2. let - coolな新しい子(変化する可能性のある変数に使用します)
  3. const - 勇敢な守護者(変化しない変数に使用します)

実際に見てみましょう:

var oldSchoolCool = "私はvar変数です";
let modernAndFlexible = "私はlet変数です";
const rockSolid = "私はconst変数です";

varをあなたの祖父のビニールレコードのように考え、letを再書き可能なCDのように考え、constをあなたが決して変更したくないお気に入りの曲のように考えます。

変数の初期化に使用される代入演算子

数学の授業で見た=記号を覚えていますか?JavaScriptでは、それを代入演算子と呼びます。変数に値を設定する魔法の杖のようなものです:

let magicNumber;  // 宣言
magicNumber = 42; // 初期化

// または、同時に両方を行うこともできます:
let theAnswerToEverything = 42;

プロ tip: 常に変数を初期化してください。これは、友達を呼ぶ前に冷蔵庫に食べ物を入れるのと同じです!

JavaScriptのデータ型

JavaScriptは、変数に格納できるデータの種類に非常に柔軟です。以下は主要なデータ型です:

データ型 説明
Number let age = 25; 数値のため
String let name = "Alice"; テキストのため
Boolean let isAwesome = true; true/falseの値のため
Undefined let mystery; 値のない変数のため
Null let emptyBox = null; 故意に空の変数のため
Object let person = {name: "Bob", age: 30}; 複雑なデータ構造のため
Array let fruits = ["apple", "banana", "cherry"]; アイテムのリストのため

実際に見てみましょう:

let myAge = 30;
let myName = "JavaScript Ninja";
let canCode = true;
let futureSkill;
let emptyMind = null;
let myProfile = {job: "Coder", hobby: "コーヒーを飲む"};
let myTodoList = ["JavaScriptを学ぶ", "素晴らしいものを作る", "世界を変える"];

console.log(typeof myAge);  // 出力: number
console.log(typeof myName);  // 出力: string
console.log(typeof canCode);  // 出力: boolean
console.log(typeof futureSkill);  // 出力: undefined
console.log(typeof emptyMind);  // 出力: object (JavaScriptのクセ!)
console.log(typeof myProfile);  // 出力: object
console.log(typeof myTodoList);  // 出力: object (配列は特別なオブジェクトです)

JavaScriptの変数名(識別子)

変数の名前を付けるのは、ペットに名前を付けるのと同じで、規則はありますが、創造的になることができます!以下は主要な規則です:

  1. 字母、アンダースコア(_)、ドルーシグン($)で始める
  2. 字母、数字、アンダースコア、ドルーシグンを含む
  3. 大文字と小文字が区別される(myVar ≠ myvar)
  4. 保留語(letconstfunctionなど)を使用できない

良い例:

let camelCase = "私はハンファ動物にちなんで名付けられました";
let _underscoreFirst = "私はアンダースコアで始まります";
let $dollarSign = "私はリッチを感じています";
let mix123 = "私は文字と数字の混合です";

あまり良くない例:

let 123abc = "私は数字で始まるので無効です";
let my-variable = "ハイフンは変数名に許可されていません";
let let = "私は保留語なので使用不可です";

JavaScriptのドルーシグン($)とアンダースコア(_)

ドルーシグン($)とアンダースコア(_)はJavaScriptの特殊な文字です。ライブラリ名や特殊な目的に使用されることが多いです:

let $_$ = "私は有効な変数名ですが、奇妙に見えます";
let _privateVariable = "私はプライベート変数を示すために使用されることが多いです";
let $jQueryObject = "私はjQueryでjQueryオブジェクトを表すために使用されることが多いです";

未定義の変数値

変数を初期化せずに宣言すると、特別な値undefinedが設定されます:

let myFuturecar;
console.log(myFuturecar);  // 出力: undefined

// これはnullとは異なります:
let myEmptyGarage = null;
console.log(myEmptyGarage);  // 出力: null

undefinedは\"ここに値を忘れた\"、nullは\"故意に空にした\"と考えます。

JavaScriptの変数のスコープ

JavaScriptのスコープは、忍者の可視性のようなものです。いくつかの変数はどこにでも見えます(グローバルスコープ)、他の変数は特定のエリアにのみ見えます(ローカルスコープ)。

let globalNinja = "私はどこにでも見えます!";

function stealthMission() {
let localNinja = "私はこの関数内でのみ見えます";
console.log(globalNinja);  // これは動作します
console.log(localNinja);   // これはも動作します
}

console.log(globalNinja);  // これは動作します
console.log(localNinja);   // これはエラーをスローします - localNinjaはここでは定義されていません

覚えておいてください、ラスベガス...つまり、関数内で起こることは、関数内に留まります(明示的に返さない限り)。

そして、あなたのJavaScriptスキルがレベルアップしたのです!コードの徒弟さん、練習は完璧を生みますので、続けてコードを書き、実験を続けてください。そのうち、プロのサーカスパフォーマーのように変数を弄ぶことができるようになるでしょう!??‍♀️

ハッピーコーディング、そして変数がいつもあなたに味方してくれることを祈っています!?✨

Credits: Image by storyset