Web プログラミング

【もりけん塾89記事】論理値/数値のオブジェクト|JavaScript

フロントエンドエンジニアを目指している、まゆ(@Ymayu_it)です。

 

すごろくを作成しようにもwhile文とbreakが分かってもメソッドやプロパティをどうやって書いたら良いのか分からないので昨日に引き続き、オブジェクトについてまとめていきます。

 

今日は

  • Boolean
  • Number

についてです。

 

(オブジェクトとメソッドを理解してカタカタJavaScriptを作成できるようなりたい…!)

JavaScriptで論理値/数値を扱うオブジェクト

論理値/数値を扱うオブジェクトにはBooleanとnumber、stringがあり、3つをラッパーオブジェクトと呼ぶそうです。

 

ちなみにオブジェクトの他の種類は、

  • ビルトインオブジェクト
  • 汎用的な機能
  • 日付/時刻
  • 配列
  • 文字列
  • 数値計算
  • 正規表現
  • エラー
  • 関数/オブジェクトを扱うオブジェクト

などがあるようです。

 

それではラッパーオブジェクトについて調べていきます。

ラッパーオブジェクト

ラッパーオブジェクトはプリミティブ型の値をオブジェクトとして包み込んだもののことのようです。

プリミティブ型を参照型として使いたいときに、ラッパーオブジェクトが活躍するってことかな?

 

メモ

プリミティブ型:数値、文字列、論理値、Null、未定義値

参照型:オブジェクト、配列、関数

 

ラッパーオブジェクトの

  • Boolean
  • Number
  • string

についてそれぞれまとめていきます。

 

Boolean

論理型を扱うときに使うオブジェクトがBoolean。

 

論理型は

  • true
  • false

の2つ。

 

空白であればfalseでスペースでもなんでも入っているとtrueになるようです。

「こんにちは」は文字列なのに''を忘れてしまってエラーがでています。

 

シングルクォーテーションの間にスペースがあればtrueに、入ってなければfalseです。

ただシングルクォーテーションがなく、スペースがあってもfalseとなりました。

 

falseになるもの

Boolean()
Boolean('')
Boolean( )
Boolean(0)
Boolean(NaN)

0とNaNもfalseになりました。

 

書き方について見ていきます。

書き方

 JavaScript
var 変数名 = new Boolean([論理値]);

 

Booleanを記載して([])引数の中に論理値を加えるような書き方になるんですね…!

 

メソッド

Booleanで使うメソッドは、

  • toString()
  • valueOf()

この2つがあるようです。

 

toString()は論理値を文字列に変換して返すもので、valueOf()はBooleanオブジェクトが保持している論理値を返すもの

 

論理値に返すか、論理値から別のものに変換するかのちがいのように見える…!

 

Number

Numberは文字通り数字を扱うオブジェクト。

 

扱うものは、

  • 整数
  • 浮動小数点
  • 無限大
  • 非数

上記のものがあるようです。

 

ConsoleでNumberを打ってみると英字が入っているものが3.1e4から31000になっています…!

なんでだろう?

 

本をみると

1.2e3および1.2e+3は「1.2x103」、1.23e-5は「1.23x10-5」を表しています。

引用:独学JavaScript,p39

とあるので、3.1x104になり3.1x10,000で31,000になっているようですね!

 

 

メモ

浮動小数点とは小数点や指数のことで、

3.14
.1
1.2e3
1.2e+3

などが浮動小数点。

書き方

 JavaScript
var 変数名 = new Number([]);

 

プロパティ

プロパティ名 説明
MAX_VALUE 最大値
MIN_VALUE 最小値
NaN 非数
NEGATIVE_INFINITY 負の最大限
POSITIVE_INFINITY 正の無限大

Numberのオブジェクトのプロパティによって最大値や最小値などが決めることができる

 

プロパティは属性なので名前や性別なので「〜が」などにあたり、メソッドによって行動にうつすのかな?

 

メソッド

メソッド名/構文 内容
toExponential(digits) 指数表記の文字列に変換して返す
toFixed(digits) 固定小数点の文字列に変換して返す
toLocalString() 数値を現地フォーマットに従った文字列で返す
toPrecision(pricision) 数値を文字列に変換して返す
toString([radix]) 基数を文字列に変換して返す
valueOf() Numberオブジェクトが保持している数値を返す

 

メソッドは文字列もしくは数値として返すことが多いように見える…!

String

Stringは文字列に関する処理に利用される。

 

文字列といえば「' '」この文字列リテラルを使うイメージがありましたが、Stringオブジェクトも同様に扱えるようです。

 

Stringオブジェクトでは

  • 文字列
  • 文字列の加工
  • 特定の文字の検索

など文字列に関するメソッドがいくつか用意されているようです。

 

文字列で使うのはStringと頭に入れておく!

 

書き方

 JavaScript
var 変数 = new String(文字列);

 

引数()に指定された文字列からStringオブジェクトを生成。

 

Stringに関するプロパティとオブジェクトをあげていきます!

プロパティ

プロパティ名 内容
length 文字列の長さを示す

Stringプロパティで扱うものはlength!

 

メソッド

メソッド名/構文 内容
charAt(index) indexに文字を返す
charCodeAt(index) indexに文字コードを返す
concat(str1[,str2...]) 文字列の末尾に引数に指定した文字列を追加した内容を返す
検索 indexOf(searchStr[,start]) 文字列の先頭から検索
lastIndexOf(searchStr[, start]) 文字列の末尾から検索
localCompare(target) 順序つけに従って比較して数値で返す
match(regex) 正規表現のパターンに一致する文字列を配列で返す
検索と置換 replace(condition,replacement) 別の文字列に置換
search(condition) 文字列か正規表現が指定できる
slice(start[, end]) startとendで文字列を切り出して返す
分割 split(delimiter[, limit]) 引数に指定した文字で分割した配列を返す
切り抜き substr(start[,length]) 開始位置と長さで文字列の一部を返す
substring([start[, end]) 開始位置と終了位置で文字列を切り出して返す
toLowerCase()、toLocaleLowerCase() 文字列をすべて小文字に変換した文字列を返す
toString() Stringオブジェクトが保持している文字列を返す
toUpperCase(),toLocaleUpperCase() 文字列をすべて大文字に変換した文字列を返す
trim() 文字の両端のスペースを取り除く
valueOf() Stringオブジェクトが保持している文字列を返す
fromCharCode([code1,code2...]) 文字コードの数値を文字列に変換して返す

 

メソッドはざっと読みましたがよく分からないので使っていく場面を調べてみます。

 

使い方

使い方は以下があるようです。

 

  1. 文字列の位置を検索
  2. 検索と置換
  3. 文字列の切り抜き
  4. 文字列の分割

 

検索や切り抜き、分割はJavaScriptで使うときがあるってことを頭に入れておこ!

おわりに

実際に何に使われてくのかが分からないところが今は多いので、こういったものがJavaScriptにあるということをまずは頭に入れる!

 

いろんなコードを触ったり読んだり作成したときに、「これ、使える」といったときにまた見直す!

 

※この記事の内容はほとんど独学JavaScriptの内容です。わかりやすい本なので個人的には好きな本^^!

 

もりけん塾(@terrace_tech

Thanks:もりけんさん

 

もりけんさんの『武骨日記』へ

 

-Web, プログラミング

© 2020 Mayu_Yamada