🐥

変数・データ型・関数とは?初心者向けに超わかりやすく解説

2025/03/03に公開
4

プログラミングを始めたばかりの方にとって、「変数」「データ型」「関数」という言葉は少し難しく感じるかもしれません。しかし、これらはプログラミングの基礎中の基礎であり、しっかり理解することでプログラミングの世界がぐっと広がります。この記事では、これらの概念をできるだけわかりやすく解説していきます。

変数とは?

変数の基本概念

変数とは、簡単に言うと「データを入れる箱」です。例えば、あなたが計算をするとき、途中の結果を紙に書いておくことがありますよね。プログラミングでの変数は、そのメモ書きのようなものです。

// 変数の宣言と代入
let age = 25;
let name = "田中太郎";

上記の例では、ageという名前の箱に25という数値を、nameという箱に"田中太郎"という文字列を入れています。

変数の命名規則

変数の名前(識別子)には、いくつかのルールがあります:

  • 英字、数字、アンダースコア(_)、ドル記号($)を使用できる
  • 最初の文字は数字にできない
  • 大文字と小文字は区別される(nameNameは別の変数)
  • 予約語(JavaScriptで特別な意味を持つ単語)は使用できない
// 良い例
let userName = "山田花子";
let user_age = 30;

// 悪い例
let 1user = "鈴木一郎";  // 数字から始まっている
let if = "条件";  // 予約語を使用している

変数の宣言方法

JavaScriptでは、変数を宣言するのに主に3つの方法があります:

  1. let: 再代入可能な変数を宣言
  2. const: 再代入不可能な定数を宣言
  3. var: 古い宣言方法(現在はあまり使用されない)
// let - 値の変更が可能
let score = 80;
score = 90;  // OK

// const - 値の変更が不可能
const PI = 3.14159;
// PI = 3.14;  // エラー!

// var - 古い宣言方法
var oldVariable = "古い方法";

データ型とは?

データ型とは、変数に格納されるデータの種類のことです。主なデータ型には以下のようなものがあります:

基本データ型(プリミティブ型)

  1. 数値型(Number)

    • 整数や小数点を含む数値
    let age = 25;
    let height = 175.5;
    
  2. 文字列型(String)

    • テキストデータ
    let name = "佐藤健太";
    let message = '今日は良い天気ですね。';
    
  3. 論理型(Boolean)

    • trueまたはfalseの値
    let isStudent = true;
    let hasLicense = false;
    
  4. 未定義(undefined)

    • 値が割り当てられていない変数
    let something;
    console.log(something);  // undefined
    
  5. null

    • 意図的に「値がない」ことを表す
    let empty = null;
    

複合データ型(オブジェクト型)

  1. オブジェクト(Object)

    • 複数の値をプロパティとして持つ
    let person = {
      name: "山本美咲",
      age: 28,
      isMarried: false
    };
    
  2. 配列(Array)

    • 複数の値を順序付けて格納
    let fruits = ["りんご", "バナナ", "オレンジ"];
    
  3. 関数(Function)

    • 実行可能なコードブロック
    function greet() {
      return "こんにちは";
    }
    
  4. 日付(Date)

    • 日時を表す
    let today = new Date();
    
  5. 正規表現(RegExp)

    • パターンマッチングに使用
    let pattern = /[a-z]+/;
    

データ型の確認方法

変数のデータ型を確認するには、typeof演算子を使用します:

let num = 42;
let text = "こんにちは";
let isActive = true;

console.log(typeof num);      // "number"
console.log(typeof text);     // "string"
console.log(typeof isActive); // "boolean"

関数とは?

関数とは、特定のタスクを実行するためのコードブロックです。料理のレシピのようなもので、一度定義しておけば何度でも使い回すことができます。

関数の基本構造

// 関数の定義
function greet(name) {
  return "こんにちは、" + name + "さん!";
}

// 関数の呼び出し
let message = greet("鈴木");
console.log(message);  // "こんにちは、鈴木さん!"

上記の例では:

  • functionキーワードで関数を定義
  • greetは関数名
  • nameはパラメータ(引数)
  • returnで結果を返す
  • 関数名と括弧()で関数を呼び出す

関数の種類

JavaScriptでは、関数を定義するいくつかの方法があります:

  1. 関数宣言

    function add(a, b) {
      return a + b;
    }
    
  2. 関数式

    const multiply = function(a, b) {
      return a * b;
    };
    
  3. アロー関数(ES6以降)

    const divide = (a, b) => {
      return a / b;
    };
    
    // 1行で書ける場合はさらに短く
    const subtract = (a, b) => a - b;
    

関数のスコープ

関数内で宣言された変数は、その関数の外からはアクセスできません。これを「スコープ」と呼びます。

function calculateArea() {
  let width = 10;
  let height = 5;
  let area = width * height;
  return area;
}

let result = calculateArea();
console.log(result);  // 50

// console.log(width);  // エラー!width は関数の外からアクセスできない

実践例:変数・データ型・関数を使ったプログラム

以下は、これまで学んだ概念を組み合わせた簡単なプログラム例です:

// 学生の情報を管理するプログラム

// 変数とデータ型の使用
const CLASS_NAME = "3年A組";  // 定数(変更不可)
let totalStudents = 30;       // 数値型
let classTeacher = "佐藤先生"; // 文字列型
let isActive = true;          // 論理型

// 学生オブジェクト(複合データ型)
let student = {
  id: 1,
  name: "山田太郎",
  age: 15,
  scores: {
    math: 85,
    english: 70,
    science: 90
  }
};

// 関数の定義
function calculateAverage(scores) {
  let total = scores.math + scores.english + scores.science;
  return total / 3;
}

function getStudentSummary(student) {
  let average = calculateAverage(student.scores);
  return `${student.name}さんの平均点は${average}点です。`;
}

// プログラムの実行
console.log(`クラス: ${CLASS_NAME}`);
console.log(`担任: ${classTeacher}`);
console.log(`生徒数: ${totalStudents}`);

// 関数の呼び出し
let summary = getStudentSummary(student);
console.log(summary);  // "山田太郎さんの平均点は81.66666666666667点です。"

まとめ

この記事では、プログラミングの基礎である「変数」「データ型」「関数」について解説しました。

  • 変数はデータを格納する箱
  • データ型は変数に格納されるデータの種類
  • 関数は特定のタスクを実行するためのコードブロック

これらの概念は、どのプログラミング言語でも共通する基本的な要素です。しっかりと理解して、プログラミングの世界を楽しんでください!

Discussion

junerjuner

プリミティブ型 を挙げるなら 複合データ型 には (オブジェクト型) と入れるべきでなのではないでしょうか?

参考まで MDNでのプリミティブの概要を載せておきます

JavaScript において、プリミティブ (primitive、プリミティブ値、プリミティブデータ型) はオブジェクトでなく、メソッドを持たないデータのことです。 7 種類のプリミティブデータ型があります。

https://developer.mozilla.org/ja/docs/Glossary/Primitive

宝松@システムエンジニア宝松@システムエンジニア

コメントありがとうございます!
たしかに、「プリミティブ型」を挙げるなら「複合データ型(オブジェクト型)」もセットで考えたほうが、より整理しやすくなりますね。 ご指摘、とても参考になります!

こういう視点を持っていただけるの、すごく嬉しいです!また何か気づいたことがあれば、ぜひ教えてくださいね!一緒に学んでいきましょう。

junerjuner

データ型の確認方法

これも 実はあまり確認できなくて "object" になるけれど プリミティブ な null とかもあるので一概に確認できるかと言われると何ともがあります。 ただ、オブジェクトかどうかは 変数 value があるとして value instanceof Object で true になるかで基本的には判断できると思われます( null と undefined も含む

※この手法の例外として ({__proto__:null}) instanceof Object の様に プロトタイプの先にObjectを持たないオブジェクトの場合は 偽になります。

オブジェクトの種類によっては 対象がそれであることを判断する為の関数を持っているものもあります。
Array.isArray() や Error.isError() 等

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/isArray

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error/isError

宝松@システムエンジニア宝松@システムエンジニア

おぉ…めちゃくちゃ丁寧で的確な解説ですね…!!
instanceof で基本的に判定できるけど、({proto:null}) instanceof Object === false になるケースまでちゃんと押さえてるのがさすがすぎます…!

Array.isArray() や Error.isError() のように専用の判定関数を使うのもスマートですね。こういう視点を持ってるの、本当に尊敬します

勉強になります!ありがとうございます!!