7日目/最新レビュー、データ更新

6日目コードコメント

もう一つ条件を変える方法がある.
「値はfalse、初期値は」のため!=省略できます.

    if (event.target.value !== "" && password !== "" && title !== "" && contents !== "") 
    = if(event.target.value && password && title && contents)

map vs filter

map

並んでいる同級生に子供を貼るときはfor文を使いますがmapも使えます.

const classmates = ["철수", "영희", "훈이"]
classmates.map((el) => (el + "어린이"))

=>  ['철수어린이', '영희어린이', '훈이어린이']

ポイントは運転後に元の配列位置に戻ることです.

const classmates2 = [
	{ name: "철수" }, 
    { name: "영희" },
    { name: "훈이"}
]

classmates2.map((el) => ({name: el.name + "어린이"}))

=> 
 {name: '철수어린이'}
 {name: '영희어린이'}
 {name: '훈이어린이'}

オブジェクトにも適用できます.

const classmates = [
	{ name: "철수" , age: 13 },
	{ name: "영희" , age: 10 },
    { name: "훈이" , age: 11 }
]


classmates.map ((el) => ({ name:el, age:el, school : "토끼초등학교" }))

各オブジェクトに要素を追加できます.

1つの関数は1つの機能です

通常、関数名は動詞で始まり、変数名は名詞で始まる.

function add(){
    const a = 1
    const b = 2

    console.log(a+b)
}

add()

function add2(aaa, bbb) {
    console.log(aaa + bbb)
}

add2(1, 2)

add2(5, 10)

function multi(zzz, qqq){
    console.log(zzz * qqq)
}
undefined
multi(2, 4)

function add3(aaa, bbb) {
    return aaa + bbb
}

const result1 = add3(2, 3)

function multi3(zzz, qqq){
    return zzz * qqq
}

const result2 = multi3(2, 4)

result1
5
result2
8
function multi3(zzz, qqq){
    return
}

矢印関数は、括弧と括弧を省略できます.

const add = (aaa, bbb) => {
    return aaa + bbb
}

add(1, 2)
=> 3

const add2 = (aaa, bbb) => (aaa + bbb)
= const add3 = (aaa, bbb) => aaa + bbb

括弧を省略したaaa=bbbは戻りを表す.

const classmates= [
    { name: "철수" },
    { name: "영희" },
    { name: "훈이" }
]

classmates.map((el) => { name: el.name + "어린이" })
 [undefined, undefined, undefined]

mapを使用する場合、オブジェクトを囲む括弧を省略することはできません.
stateが変更されると再レンダリングされますが、作成した子供は再作成されません.
関数型素子が使える理由は、使うために作った子供たちです.
分割キー={}は使用できますが、分割キーを使用しないと単独では使用できません.