chatGPTと学ぶJavaScript　第１週：JavaScriptの基礎〜データ型編〜 #初心者

こちらの続きです。

データ型

データ型とは

データの型...型?
単語だけではイメージがつかないのでchatGTP先生に聞いてみます。

JavaScriptにおけるデータ型とはどのようなものですか？

chatGPTの答え
データ型とは、値の種類を表すもので、値の種類に応じて操作や扱い方が異なります。
JavaScriptには以下のデータ型があります。

数値（Number)
文字列（String）
真偽値（Boolean）
undefined
null
シンボル（Symbol）
オブジェクト（Object）
配列

1〜6までのデータ型は「プリミティブ型」と呼ばれ、7,8のデータ型はオブジェクト型と呼ばれます。
以下に各データ型の説明と例を示します。

数値（Number)
数値は、整数や少数を表します。数値を作成する方法はいくつかありますが、最も基本的な方法は以下のように数値を直接書くことです。
JavaScript
```
let num1 = 123;  // 整数を代入
let num2 = 3.14; // 少数を代入
```
文字列（String）
文字列は、文字の集まりを表します。文字列を作成する方法は、ダブルクォーテーション（""）かシングルクォーテーション（''）で文字列を囲むことです。
JavaScript
```
let str1 = "Hello";      // ダブルクォーテーションで文字列を代入
let str2 = 'JavaScript'; // シングルクォーテーションで文字列を代入
```
真偽値（Boolean）
真偽値は、true（真）かfalse（偽）の２つの値を表します。真偽値は、条件式の結果を表す際に使用されます。
JavaScript
```
let bool1 = true;  // trueを代入
let bool2 = false; // falseを代入
```

undefined
undefinedとは、値が未定義であることを表します。

JavaScript

let undef;          // 値が未定義（undefined）
console.log(undef); // undefinedが出力される

null
nullとは値が存在しないことを表します。

JavaScript

let nullValue = null;   // nullを代入
console.log(nullValue); // nullが出力される

シンボル（Symbol）
ES2015（ES6)から追加された、プリミティブ型の一つです。
（「ES2015？ES6？なにそれ呪文？」と言う方は「JavaScript　バージョン」で検索すると色々解説が出てきますよー）
シンボルは、ユニークな識別子を作成するために使用されます。
シンボルは以下のように作成します。
JavaScript
```
const mySymbol = symbol(); // 空のシンボルを作成
```
シンボルは名前をつけることができます。
JavaScript
```
const mySymbol = symbol("mySymbol"); // mySymbolという名前をつけたシンボルを作成
```
シンボルは一意であるため、同じ名前をつけたシンボルでも別のシンボルとして扱われます。
主にオブジェクトのプロパティ名として使用されます。
JavaScript
```
const mySymbol = Symbol("mySymbol");
const obj = {
    [mySymbol]: "symbol property"
};
console.log(obj[mySymbol]); // "symbol property"が出力される
```
シンボルは、グローバルシンボルレジストリ（Global Symbol Registry）を使用することで、グローバルに一意なシンボルを作成することもできます。
JavaScript
```
const mySymbol1 = Symbol.for("mySymbol"); // "mySymbol"という名前のグローバルシンボルを作成
const mySymbol2 = Symbol.for("mySymbol"); // グローバルシンボルレジストリに登録されている同じ名前のシンボルを取得
console.log(mySymbol1 === mySymbol2); // trueが出力される
```
オブジェクト（Object）
オブジェクトは、関連するプロパティやメソッドをグループ化したものです。オブジェクトは、中括弧（{}）を使って作成します。
JavaScript
```
let obj = {        // オブジェクトを作成
    name: "John",  // プロパティnameに"John"を代入
    age: 30        // プロパティageに30を代入
};
```

...
ということです。
シンボルは初耳でした。
とりあえず最初は、「値がジャンル分けされている」ことと「ジャンルによって扱い方が変わる」らしいってことがわかっていれば良いかと。
各データ型の詳細は使いながら理解していく方が頭に入ると思います。

以下でchatGTP先生の説明に、少し補足いたします。

補足

数値型と文字列

よくあるのが「"1"」と「１」はデータ型が違うよ、ということ。
この違いは超大事です。
上で説明されているようにダブルクォーテーションで囲まれているものは「文字列」として扱われます。
なので、
「"1"」は文字列
「1」は数値
という違いがあります。
どちらも１なのですが、
"1" == 1
はtrue（==はデータ型は気にしなーい。両方１だから真！）
"1" === 1
はfalse（===はデータ型も一緒じゃないと偽になります。シビア！）
なのです。
ここを理解していないと思わぬエラーにぶち当たるので注意です。

真偽値

真偽値は、条件式（条件式が何か、については後述します）で使われます。
指定した条件を評価した時に、真ならtrue、偽ならfalseを返す訳ですが、
ここで使用されるのはtrue falseだけでなく
「trueとみなされる値」、「falseとみなされる値」の場合もあります。
簡単にご紹介しておきますね。

trueとみなされる値
true
0以外の数値（1、-1、0.5など）
空でない文字列（"hello","0","false"など）
配列やオブジェクトなどの空でない要素がある値

falseとみなされる値
false
数値の0
空の文字列（"",'',``）
null
undefined
NaN(Not a Number)
※NaNは数字でないことを表す特別な値のことを指します。主に、数値を取り扱う関数や演算子が、数値以外の値を受け取った場合に返されます。

nullとundefinedの違い

両方値がないのでは...?何が違うの？？とお思いの皆さん、私もそう思う！
のでchatGPTさんに追加で聞いてみました！

nullとundefinedの違いを説明してください

chatGPTの答え
undefinedは、変数が初期化されていない、またはオブジェクトのプロパティが存在しない場合に自動的に割り当てられます。
つまり、宣言された値が代入されていない変数、またはオブジェクトに存在しないプロパティを参照した場合にundefinedが返されます。
例えば以下のような場合にundefinedが返されます。

JavaScript

let x;
console.log(x); // undefined

const obj = {};
console.log(obj.property); // undefined

一方、nullは「存在しない」という値を明示的に表現するために使用されます。
変数にnullを代入することで、「値は存在しない」という意味を明確に示すことができます。
例えば以下のような場合にnullが返されます。

JavaScript

let y = null;
console.log(y); // null

const obj2 = {property: null };
console.log(obj2.property); // null

つまり、undefinedは値が代入されていない場合に自動的に割り当てられる「初期化されていない」状態を表し、nullは明示的に「値は存在しない」という状態を表す。
...
なるほど、状況としては両方とも「値がない」んだけど
undefinedは値が代入されていない状態で
nullは「値がない」という状態が代入されている
という違いがあるようです。
ややこし〜〜

さて、それぞれのデータ型を見てきました。
数値と文字列はともかく、使い慣れないと他のデータ型は何のこっちゃですね。

どんな種類があるのかは、何となく頭に置いておいて、
それぞれをどのように扱うかは
実際コードを書きながら理解していくのが良いと思います。
第3〜4週の学習では、実際にコードを書いていく予定なので
その中で理解を深められたらと思います。

リンク

全てのカリキュラムへのリンクは導入編に置いております

導入編

JavaScriptとは何か、基本的な文法

データ型 ⇦NOW!!

変数

演算子

制御構文

chatGPTと学ぶJavaScript 第１週：JavaScriptの基礎〜データ型編〜

データ型

データ型とは

補足

数値型と文字列

真偽値

nullとundefinedの違い

リンク

chatGPTと学ぶJavaScript　第１週：JavaScriptの基礎〜データ型編〜