LoginSignup
3
3

More than 1 year has passed since last update.

【JavaScript】オブジェクトについて

Last updated at Posted at 2021-06-21

はじめに

JavaScriptの基礎を勉強したらとても良い学びになったのでメモ
JavaScriptのオブジェクトについてです

こちらの本を参考にさせていただきました

概要

オブジェクトとは:

名前をキーにアクセスできる配列

  • 連想配列との違い
    連想配列:複数要素の集合体(個々の要素が主体)
    オブジェクト:1つのモノを表現するために、複数の属性情報をもつ(モノ全体が主体)

  • オブジェクト=プロパティ+メソッド
    プロパティ:オブジェクトの状態や特性を表すための情報
    メソッド:オブジェクトを操作するための道具
    オブジェクト.png

new演算子(インスタンス)

オブジェクトは自身でデータを保持できる
競合を避けるためオブジェクトのコピーを作成して操作する
インスタンス化

インスタンス生成方法

var 変数名 = new オブジェクト名([引数,])

プロパティ/メソッド呼び出し方法

変数名.プロパティ名
変数名.メソッド名

例外)静的プロパティ/メソッド

組み込みオブジェクト

…JavaScriptが動作するすべての環境で利用可能なオブジェクト

ex)

  • Object:すべてのオブジェクトのひな型となる機能を提供
  • Array:配列を操作するための手段を提供
  • Map:キー/値からなる連想配列を操作するための手段を提供
  • String:文字列を操作するための手段を提供
  • Function:関数を操作するための手段を提供

→リテラルをそのまま対応する組み込みオブジェクトとして利用できるため、インスタンス化をほとんど意識する必要がない

Objectオブジェクト

...全てのオブジェクトの基本オブジェクト

ex)

  • toStringメソッド:そえぞれのオブジェクトの内容を基本型の値に変換する
  • assignメソッド:既存のオブジェクトを結合できる
  • createメソッド:オブジェクトを生成する

Globalオブジェクト

...グローバル変数やグローバル関数を管理するため、JavaScriptが自動的に生成する便宜的なオブジェクト

ex)

  • Numberオブジェクト:数値にかかわる機能
    isFinite, isNaN, parseFloat, parseInt

  • encodeURI/encodeURIComponent関数:クエリ情報をエスケープ処理する
    URLの末尾「~?」以降に「キー名=値 &…」の形式
    →クエリ情報(=サーバー上で動くアプリへの問い合わせに必要なデータ)

URIエンコード(=クエリ情報は渡せる情報に制限があるため、無害な文字列に変換する)

  • eval関数:与えられた文字列をJavaScriptのコードとして評価・実行する

第三者が任意にスクリプトを実行できてしまうセキュリティリスク・処理速度が遅いという理由からJSON.parseで代用

おわりに

今までなんとなく使っていたものの仕組みとかを知ると、伏線回収みたいになってとても面白いですね

  • オブジェクトという概念
  • 関数をfunction()で定義していたのも実は、組み込みオブジェクトを利用していた

という2点が特に勉強になりました

他のことも学んだらQiitaでアウトプットしていきたいです

3
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
3