JavaScript関連のことを調べてみた

データ型ってなに？

# データ型とは何か
データ型は、プログラミングにおいてデータの性質や取り扱い方を定義したもので、それぞれのデータには特定の型が割り当てられます。データ型はプログラミングが亜データを理解し、処理する際に役立ちます。

### データ型の例
#### 1.数値型（Number）
* 整数や乳動小数点数を証言します。　例）：’5′, ‘3.14’
#### 2.文字列型(String)
* 文字のシーケンスを表現します。　例）: “Hello, World!”
#### 3. 真偽値型(Boolean)
* ‘true’ または ‘false’のいずれかを表現します。 例）: ‘true’
#### 4.オブジェクト型(Object)
* 複数の値やプロパティをまとめたものを表現します。 例): ‘{name: “John”, age: 20 }’

# なぜデータに「型」があるのか
なぜデータに「型」があるのかについては、主に以下の理由が挙げられます
#### 1.　効率的なメモリ利用
* データ型によって、プログラムはメモリの適切な領域を確保し、無駄なメモリの使用を防ぐことが

JS ズンドコ コードゴルフ

数年前に散々こすられたズンドコキヨシプログラムをJSでコードゴルフしていく。

なお今回は改行文字はカウントしない流派だよ。

“`js:81文字
t=”
for(c=1;c;)
t+=Math.random()<.5?(c++,'ズン'):(c=c<5,'ドコ') console.log(t+'キ・ヨ・シ！') ``` ## その他（没） ```js:86文字 for(t='';!t.includes`ズンズンズンズンドコ`;)t+=Math.random()<.5?'ズン':'ドコ' console.log(t+'キ・ヨ・シ！') ``` ```js:86文字 t='' while(!t.includes`ズンズンズンズンドコ`) t+=Math.random()<.5?'ズン':'ドコ' console.log(t+'キ・ヨ・シ！') ``` ```js:91文字 a='ズン' b='ドコ' for(t='';!t.includes(a+a+a+a+b);)t+=Math.random()<.5?a:b console.log(t+'キ・ヨ・シ！') ``` ##

consoleはlog()だけじゃない！　

## 環境
Chrome（バージョン: 119.0.6045.105）

## console.assert()
第１引数がfalseのときは第２引数のメッセージを出力する。

“`jsx
const isEven = (number) => {
if (number % 2 === 0) {
return true;
} else {
return false;
}
}

console.assert(isEven(3), ‘奇数です’);
console.assert(isEven(2), ‘偶数です’);
“`

## console.clear()

コンソールをクリアする

↓実行後
JavaScript API連携　自分メモ

# 概要
XMLHttpRequest(XHR)を利用してWebAPIを処理する実装を行っていた。
記述量が多くなりがちな印象。
> XMLHttpRequest（XHR）とは、Webブラウザなどに実装されているJavaScriptのAPIおよびオブジェクトの一つで、スクリプトからHTTPを利用してWebサーバにアクセスする機能を提供するもの。
>
https://developer.mozilla.org/ja/docs/Web/API/XMLHttpRequest

そこからFetchを利用してWebAPIを処理する実装へ変わっていった。
Promiseを使用できるので成功・失敗の処理を記述しやすい印象。

https://developer.mozilla.org/ja/docs/Web/API/Fetch_API/Using_Fetch

さらに使いやすいaxiosへ

https://github.com/axios/axios

# XHR API連携

“`script.js
const req = new XMLHttpRequest();
// リクエスト生成

【Nuxt・Vue】フォーカスで数値、フォーカスアウトでカンマ付き数値のテキストフィールド

## はじめに

金額系のテキストフィールドを実装する際に以下のようなUI仕様にしたいってありますよね。
1. 通常は「100,000」のように3桁でカンマ区切りで数値をテキストフィールドに表示したい
2. マウスやTABキーなどでテキストフィールドにカーソルが当たったら「100000」と普通の数値の編集ができる
3. カーソルがテキストフィールドから外れたら再び「100,000」の表示になる

今回はVue(Nuxt)でこの機能を実装したテキストフィールドコンポーネントのサンプルコードを紹介します。

:::note warn
これはプロトタイプです。
最低限の機能のみなので、要件に応じてここからpropsなどを追加してアレンジしてくださいね！
:::

## デモ

https://codesandbox.io/embed/jdd57d?view=Editor+%2B+Preview&module=%2Fsrc%2Fcomponents%2Ftextfield.vue

“`vue:App.vue