1/2　不明点の復習

2023年1月2日 16:49

オブジェクト指向とは

いかに効率よく開発を行うかを突き詰めた考えかた、概念

設計：下記の3つを主体に設計する
カプセル化：他のプログラムから鑑賞されないプログラム
継承：同じようなプログラムは共通化して使う考え方（共通の部分はまとめてあつかう）
ポリフォーリズム：汎用的なかたちにできるようにしましょうという考え方（多様性）

メソッド

オブジェクトの中にある関数
メソッドのあとに（）がつく

console.logはオブジェクト.メソッド
consoleというオブジェクトの中から、logというメソッドを取り出している。　

alert()メソッドは正式にはwinodow.alert()という記載になる。
よくあるアラートやポップアップの挙動はうwinodowsオブジェクト
document ：Htmlの文書の全体を指している
element　：要素

プロパティ
オブジェクトの中にある情報
keyと値のペアで成り立っている。
keyをプロパティ名と呼ぶ。
例）タイトル：吾輩は猫である
タイトルがプロパティ名

querySelectorとgetElementBy～の違い

querySelector：CSS のセレクタで表現できる要素なら何でも取得可能。 id 、 className 、Tag name などの要素から検索できるので汎用性は高い
getElementBy～：「～」の部分しか検索できない。elementしか取得できない。
- ただしquerySelectorより読み込みが早い（人間がわかるかわからないかのレベル）
this置く場所や引き出したい値に応じて内容が変わる変数
アロー関数と、function()のような関数宣言で内容が変わってくるので注意

フレームワークとライブラリの違い

フレームワーク(framework)
- アプリケーションを開発するのに必要な機能がデフォルトで揃っているもの、テンプレートみたいなもの
  - Vue.js、React.js etc
ライブラリ(library)
- 作業を簡略化するために使用できる予め書き込まれたプログラムの集まり
  - GSAP、jQuery etc
フレームワークはアプリケーションを開発するのに必要な土台、ライブラリはプログラマーの作業を簡略化し、開発のプロセスを効率化するために予め定義された関数やクラスの集合体

DOM

DOMとはDocument Object Model
DOMツリーという階層構造を持っている

<body>
├──<section>
│ ├──<p>
│ ├──<p>
│ └──<p>
├──<section>
│ └─<p>
...

Node

Nodeは、「DOMツリーを構成する一つ一つの要素」。
親ノードや子ノードなどを持つ

<親ノード>
├──<ノード>
│ ├──<子ノード>
│ ├──<子ノード>
│ └──<子ノード>

Element

Elementは、「Nodeの種類の一種」
Document、Element、DocumentFragmentといったものがNodeの種類として該当し、それぞれ異なるメゾッドが定義されている。

この記事が気に入ったらサポートをしてみませんか？

1/2 不明点の復習