Slide 1
Slide 1 text
null or unde
fi
ned
2024-08-24 Kyoto.ͳΜ͔ #6
id:susisu
Slide 2
Slide 2 text
͜Μʹͪ
• id:susisu
• גࣜձࣾͯͳ
WebΞϓϦέʔγϣϯΤϯδχΞ
• ਓؒ ( TypeScript | ESLint | Prettier )
Slide 3
Slide 3 text
JavaScript ͱ͍͑
Slide 4
Slide 4 text
null ͋Δ
unde
fi
ned ͋Δ
Slide 5
Slide 5 text
Α͋͘Δઆ໌
• null: ͕ͳ͍ͱઃఆ͞Ε͍ͯΔ
• unde
fi
ned: ͕ઃఆ͞Ε͍ͯͳ͍
Slide 6
Slide 6 text
ΫΠζΛ͖࣋ͬͯ·ͨ͠
Slide 7
Slide 7 text
ୈҰ
Slide 8
Slide 8 text
> const x = new Map([["foo", "hello"]]);
> x.get("foo");
"hello"
> x.get("bar");
???
Slide 9
Slide 9 text
> const x = new Map([["foo", "hello"]]);
> x.get("foo");
"hello"
> x.get("bar");
undefined
Slide 10
Slide 10 text
ୈೋ
Slide 11
Slide 11 text
> const x = new Headers([["foo", "hello"]]);
> x.get("foo");
"hello"
> x.get("bar");
???
Slide 12
Slide 12 text
> const x = new Headers([["foo", "hello"]]);
> x.get("foo");
"hello"
> x.get("bar");
null
Slide 13
Slide 13 text
> const x = new Headers([["foo", "hello"]]);
> x.get("foo");
"hello"
> x.get("bar");
null
🤷
Slide 14
Slide 14 text
Α͋͘Δઆ໌ ≠ ݱ࣮
• null: ͕ͳ͍ͱઃఆ͞Ε͍ͯΔ
• unde
fi
ned: ͕ઃఆ͞Ε͍ͯͳ͍
Slide 15
Slide 15 text
ݱ࣮
• લఏ: "JavaScript" ͍ͭ͘ͷඪ४༷͔ΒΓཱ͍ͬͯΔ
• ECMAScript ͷݴޠ༷Ͱද͖΄΅ unde
fi
ned ͕ΘΕΔ
• ͨͩ͠ਖ਼نදݱ, JSON, ϓϩτλΠϓͷΈྫ֎తʹ null ͕ొ͢Δ
• Web ؔ࿈༷ (DOM, Fetch ͳͲ) Ͱ׳ྫతʹ null ͕ΘΕΔ͜ͱ͕ଟ͍
• ҙຯతͳ͍͚ΑΓ, ΄΅༷͝ͱʹҰ؏ͯ͠ͲͪΒ͔Λ͏
Slide 16
Slide 16 text
ΫΠζ࠶։
Slide 17
Slide 17 text
ୈҰ
Slide 18
Slide 18 text
> const x = new Map([["foo", "hello"]]);
> x.get("foo");
"hello"
> x.get("bar");
???
Slide 19
Slide 19 text
> const x = new Map([["foo", "hello"]]);
> x.get("foo");
"hello"
> x.get("bar");
undefined
ECMAScript ͷݴޠ༷Ͱఆٛ
Slide 20
Slide 20 text
ୈೋ
Slide 21
Slide 21 text
> const x = new Headers([["foo", "hello"]]);
> x.get("foo");
"hello"
> x.get("bar");
???
Slide 22
Slide 22 text
> const x = new Headers([["foo", "hello"]]);
> x.get("foo");
"hello"
> x.get("bar");
null
Fetch Standard Ͱఆٛ
Slide 23
Slide 23 text
> const x = new URLSearchParams([["foo", "hello"]]);
> x.get("foo");
"hello"
> x.get("bar");
null
URL Standard Ͱఆٛ
Slide 24
Slide 24 text
ୈࡾ
Slide 25
Slide 25 text
> document.getElementById("nonexistent");
???
Slide 26
Slide 26 text
> document.getElementById("nonexistent");
null
DOM Standard Ͱఆٛ
Slide 27
Slide 27 text
ୈ࢛
Slide 28
Slide 28 text
> const xs = ["A", "B", "C"];
> xs.find((x) => x === "A");
"A"
> xs.find((x) => x === "Z");
???
Slide 29
Slide 29 text
> const xs = ["A", "B", "C"];
> xs.find((x) => x === "A");
"A"
> xs.find((x) => x === "Z");
undefined
ECMAScript ͷݴޠ༷Ͱఆٛ
Slide 30
Slide 30 text
ୈޒ
Slide 31
Slide 31 text
> const x = "ABC";
> x.match(/A/);
["A", ...]
> x.match(/Z/);
???
Slide 32
Slide 32 text
> const x = "ABC";
> x.match(/A/);
["A", ...]
> x.match(/Z/);
null
ECMAScript ͷݴޠ༷Ͱఆٛ
ਖ਼نදݱྫ֎తʹ null
Slide 33
Slide 33 text
> /A/.exec("ABC");
["A", ...]
> /Z/.exec("ABC");
null
Slide 34
Slide 34 text
·ͱΊ
• null ͱ unde
fi
ned ༷͝ͱʹ֓ͶҰ؏ͨ͠ΘΕํΛ͍ͯ͠Δ
• ECMAScript ͷݴޠ༷Ͱද͖΄΅ unde
fi
ned ͕ΘΕΔ
• Web ؔ࿈༷Ͱ׳ྫతʹ null ͕ΘΕΔ͜ͱ͕ଟ͍
• ҙຯతʹ͍͚ΒΕ͍ͯΔ͜ͱ΄΅ͳͦ͞͏
Slide 35
Slide 35 text
͍͚ͷώϯτ
• جຊ unde
fi
ned Λ͏ͷ͕͓͢͢Ί
• ݴޠΈࠐΈͷػೳͱฒͯҧײ͕ग़ʹ͍͘
• Web ͷ API , null Λ͏ϥΠϒϥϦʹڧؔ͘࿈͢Δ෦ͳΒ
null Λͬͯ౷ҰײΛग़͢ͷΞϦ
• ͳΜʹͤΑҰ؏͍ͨ͠ํ͕͞Ε͍ͯΔͷ͕Θ͔Γ͍ͩ͢Ζ͏
Slide 36
Slide 36 text
ࢀߟจݙ
• ECMAScript® 2024 language speci
fi
cation
• https://ecma-international.org/publications-and-standards/standards/
ecma-262/
• WHATWG Standards
• https://spec.whatwg.org
Slide 37
Slide 37 text
ͳΜͰ͜ͷΛ?
• ECMAScript ͷݴޠ༷ʹର͢Δ proposal Ͱ null ͕ΘΕ͍͔ͯͨΒ
• https://github.com/arthur
fi
orette/proposal-safe-assignment-operator
• > The result should conform to the format [error, null | undefined]
or [null, data].
• ͔֬ʹҙຯతʹؒҧ͍ͬͯͳ͍͕, ༷ͷҰ؏ੑతʹͲ͏?