Javascript初歩中の初歩

javascriptで学んだことの備忘録

jsでオブジェクトを生成する場合は、

let human = {name: 'uycep2ed'}

変数humanはnameというプロパティ持っているという意味になる。

プロパティは属性名である"プロパティ名"とデータである"値"をセットである。

rubyでいうハッシュのような形である。

※　letとconstの違い

letは再代入可能

constは再代入不可

変数humanにプロパティを追加したい場合

性別を追加

let human = { name: 'uycep2ed' }
console.log(human)

human.sex = man
//もしくは
human['sex'] = 'man'

console.log(human)
//結果
{name: "uycep2ed", sex: "man"}

値を変更したい場合

let human = {
  name: "uycep2ed",
  sex: "man"
}

human.sex = "woman"

console.log(human)
//結果
{name: "uycep2ed", sex: "woman"}

オブジェクトのメソッドの操作

let human = {
  name: "Tsukamon",
  sex: man,
  age: 22,

  talk: function(){
  console.log(`私は${human.name}です。年齢は${human.age}歳です`) 
  },

human.talk
//　結果
私の名前はTukamonmです。年齢は２２歳です

HTMLの習得方法

idで習得する方法

document.getElementById("id名")

classで習得する方法

document.getElementsByClassName("class名")

※　classは複数使用している場合があるのでElementsと複数形になることに注意！

document.querySelectorAll("セレクタ名")

document.querySelectorもあり、こちらは最初のに見つかったセレクタの一つだけ

セレクタ名とは、CSSでスタイルを適用するために指定している要素のこと

class名は（”.class名”）

id名は(#id名)

HTMLタグは("タグ名")

と表記します。

getElementsByClassNameと

querySelectorAllの違いについて

getElementByClassName→HTMLCollectionで返す

querySelectorAll→NodeListで返す

それぞれによって使えるメソッドに違いがあります。

違いは戻り値に違いがあります。