[javascript] ObjectとArrayの小技集

# Arrayから空の要素を除く
```javascript:example.js
const array = ["foo", "boo", "", "bar"];
const newArray = array.filter(Boolean); //["foo", "boo", "bar"]

const paragraph = `これは一行目です
これは二行目です

これは三行目です
これは四行目です
`;
const sentences = paragraph.split("\n").filter(Boolean);
// ["これは一行目です", "これは二行目です", "これは三行目です", "これは四行目です"]
```
 このコード行は、JavaScriptにおいて配列から「falsy」(偽と評価される) 値を取り除く簡潔な方法を示しています。ここで使用されている .filter() メソッドは、配列の各要素に対してテスト関数を実行し、その関数が true を返した要素のみからなる新しい配列を生成します。

 # ObjectのキーをArrayにする
 このコードスニペットでは、users という名前のオブジェクトが定義されており、その中に taro、jiro、hanako という3つのプロパティがあります。各プロパティ（またはキー）は、それぞれ異なるユーザーを表しており、各ユーザーには gender（性別）と hobby（趣味）という2つのプロパティがあります。
 ```javascript:example.js
const users = {
  taro: {
    gender: "男",
    hobby: "水泳",
  },
  jiro: {
    gender: "男",
    hobby: "読書",
  },
  hanako: {
    gender: "女",
    hobby: "カラオケ",
  },
};
 ```
 このオブジェクトに対して Object.keys(users); を実行すると、users オブジェクトのトップレベルのキー（プロパティ名）のみが含まれた配列が返されます。この場合、トップレベルのキーは taro、jiro、hanako です。したがって、このメソッドの出力は ["taro", "jiro", "hanako"] となります。
  ```javascript:example.js
Object.keys(users);
// output: ["taro", "jiro", "hanako"]
 ```
# Objectからキーを指定して、Arrayを抽出する
このコードスニペットでは、items という名前の配列が定義されており、その中に3つのオブジェクトが含まれています。各オブジェクトには id と name という2つのプロパティがあります。
 ```javascript:example.js
const items = [
  { id: 1, name: "アイテム1" },
  { id: 2, name: "アイテム2" },
  { id: 3, name: "アイテム3" },
];
 ```
この配列に対して map() メソッドを使用しています。map() メソッドは、配列の各要素に対して与えられた関数を実行し、その結果からなる新しい配列を生成します。この場合、各 item オブジェクトに対してアロー関数 (item) => item.name が実行されます。この関数は各オブジェクトの name プロパティの値を返します。
  ```javascript:example.js
items.map((item) => item.name);
// output: ["アイテム1", "アイテム2", "アイテム3"]
 ```
 # ネストされたキーを更新
このコードスニペットは、school というオブジェクトが定義されており、その中には学校の名前、校長、住所、そして2つの学部（science と arts）が含まれています。各学部には、学部長とコースのリストがあります
```javascript:example.js
const school = {
  name: "東京高校",
  head: "井上",
  address: "東京都新宿区",
  departments: {
    science: {
      head: "田中",
      courses: ["物理学", "化学", "生物学"],
    },
    arts: {
      head: "佐藤",
      courses: ["文学", "歴史", "美術"],
    },
  },
};
 ```
 setNestedKey 関数は、オブジェクト (json)、更新したいキー (key)、そしてそのキーに設定したい新しい値 (value) を引数として受け取ります。この関数は、与えられたオブジェクト内のすべてのレベルで指定されたキーを探し、見つかった場合はその値を新しい値で更新します。関数は再帰的に定義されており、オブジェクト内のオブジェクト（ネストされたオブジェクト）に対しても同様の操作を行います。
```javascript:example.js
const setNestedKey = (
  json: { [key: string]: any },
  key: string,
  value: string
) => {
  for (const k in json) {
    if (k === key) {
      json[k] = value;
    } else if (typeof json[k] === "object") {
      setNestedKey(json[k], key, value);
    }
  }
};
 ```
この関数を school オブジェクトに対して setNestedKey(school, "head", "小林"); として実行すると、school オブジェクト内のすべての "head" キー（校長と学部長）の値が "小林" に更新されます。つまり、school オブジェクトの head、departments.science.head、および departments.arts.head の各プロパティが "小林" に変更されます。
```javascript:example.js
setNestedKey(school, "head", "小林");
 ```

# Objectは空か判定する
:::note warn
if(空のobject)はtrueが返却されるので判定できません
:::
```typescript:example.ts
const obj = {};

if (Object.keys(obj).length === 0) {
  console.log("空");
} else {
  console.log("中身あり");
}
```

# shift()とpop()を使う
shift() メソッドは、配列の先頭から要素を削除し、その要素を返します。
```typescript:example.ts
let numbers = [1, 2, 3, 4, 5];
let firstElement = numbers.shift();

console.log(firstElement);  // 出力: 1
console.log(numbers);       // 出力: [2, 3, 4, 5]
```
pop() メソッドは、配列の末尾から要素を削除し、その要素を返します。
```typescript:example.ts
let numbers = [1, 2, 3, 4, 5];
let lastElement = numbers.pop();

console.log(lastElement);  // 出力: 5
console.log(numbers);       // 出力: [1, 2, 3, 4]
```