ume

javascript知らなかったこと

知らなかったこと

  1. javascriptの2種類のデータの型,オブジェクト型とプリミティブ型

  2. オブジェクトのメソッドの定義(rubyでいうハッシュ)

1. javascriptの2種類のデータの型,プリミティブ型とオブジェクト型

プリミティブ型

特徴:変数の中身(値)が同じでも別々のデータと解釈される=一度作成したらその値を変更することができません。

let str1 = 'Hello'; 
const str2 = str1; 
console.log(str1, str2); 出力結果 Hello Hello 

str1 = "World"
console.log(st2); ここでもHelloと出力される

const str2 = str1; ここでstr1のコピーをstr2に代入しているので後からstr1の値が更新されてもstr2は影響を受けない。=str1とstr2は別物扱い.

↑のような挙動になる説明↓.
例2つの変数を定義したとき

let str1 = "Hello"
let str2 = str1

例えばstr1 = "Hello"の変数を定義するとHelloがメモリの特定の場所(0001)に格納される。この格納された場所(0001)を「アドレス」という。str1が値を保持する0001に紐づいて、別の場所に保存される(0002) str1も2も同じ0001を参照していますが別のデータです.
その後str1を下記の様に更新したとします。

str1 = "World"

そしたら str1の参照先が0001から0004に変わるだけなのでstr2に影響はなくstr1を更新した下に時もかかわらずHelloを参照している。

プリミティブ型の詳細↓.
www.r-staffing.co.jp

* 文字列型(string型)
let fruit = 'apple';
* 数値型(number型)
let age = 30;
* 論理型(boolean型)

trueかfalseを返す

let isActive = false;

変数名はis~という風につけるのがいい

* undefined
let color;

変数名だけ定義

* null
let box = null;

オブジェクト型

⇨オブジェクトはプロパティの集合体.

プロパティとは? ⇨name(key)とみかん(value)の組み合わせをプロパティという.

オブジェクトはkeyを使ってvalueにアクセスする.

let fruits = {
    name: "みかん",
};
console.log(fruits["name"]):#出力結果みかん

オブジェクトは下のようにデータを持つている。0005がキーとvalueを全て管理しており、その0005をproductが参照している。

もしここで以下のようにproduct2という変数を作成した場合

let product2 = product1

product2はproduct1と同じものを参照している。なのでproduct1の変更はproduct2にも反映される

* 配列

一見keyの記載がないように見えるが配列は左から0,1,2といった数字をkeyとして配列の中身にアクセスする

let fruits = ['ブドウ', 'グレープフルーツ'];
console.log(fruits[0]); #出力結果ブドウ

オブジェクトのメソッドの定義(rubyでいうハッシュ)

プロパティの追加

fruits.新しいキー = 値
const fruits = {
  name: "もも",
  price: 120,
  say: () => {console.log("高い")}
}

fruits.stock = 5
console.log(fruits);出力結果{name: 'りんご', price: 100, stock: 5, sayDescription: ƒ}

プロパティの削除

delete fruits.削除したいkey
const fruits = {
  name: "もも",
  price: 120,
  stock: 5,
  say: () => {console.log("高い")}
}

delete fruits.stock;
console.log(fruits.);出力結果{name: 'りんご', price: 100,  sayDescription: ƒ}
例外

⇨スプレッド構文を使うことで上で説明したproduct1の変更がproduct2に影響されない様になる要はプリミティブがと同じように変更が他に影響を与えない様にできる

qiita.com