ECMAScript仕様輪読会 #24
前回: ECMAScript仕様輪読会 #23
Scrapboxの招待リンク: https://scrapbox.io/projects/esspec/invitations/85b96c9fa718ce5185e307196ed8fb53
connpass: https://esspec.connpass.com/
Discord: https://discord.gg/59S3y6weQj
Twitter hashtag: #esspec
便利ツール
esspec-memo: https://tars0x9752.github.io/esspec-memo/esspec.html
Scrapbox Codeblock Generator: https://vzvu3k6k.github.io/scrapbox-codeblock/
自己紹介 (近況報告)
syumai
Twitter: https://twitter.com/__syumai GitHub: https://github.com/syumai
ThinkPad X1 Nanoを買いました
SSDがM.2 2242 ? というやつで、差し替え用のやつを探すのが難しかった
Windowsを消したいので、Ubuntuをクリーンインストール出来るSSDが欲しかった
12月からドラム教室に通います
Jun Yasumura / harupiyo Jun Yasumura.icon
英語のcanonical(https://ejje.weblio.jp/content/canonical 正典の、教会法に基づく、規準的な、標準的な )が、どうしても音楽のカノン(輪唱するやつ)のイメージに引きずられてしまう→音楽のカノンも実は教会法に基づく規範の、という意味だった→納得感
tars0x9752 (たーず / naoki aoyama) tars0x9752.icon
esspec-memo のサイトの作りをそこそこ大幅に更新した
https://tars0x9752.github.io/esspec-memo/
そして新たに数値まわりについてメモを追加した
https://tars0x9752.github.io/esspec-memo/esspec/algorithm/mo.html
仕事で使ってる PC の gpu ファンがものすごい異音をたてるようになって焦った
外付けディスプレイつなぐためにしか使ってないが...
ファン交換するか悩む
TC39 プロポーザルだそうかなとおもったらすでに同じやつが stage2 にあった
JSConf JP が楽しみ
spatial chat らしいのでどんな感じになるのか楽しみ
最近ベースちょいちょいやってる
Nozomu Ikuta NozomuIkuta.icon
Twitter: https://twitter.com/NozomuIkuta
GitHub: https://github.com/NozomuIkuta
新しい職場のキャッチアップで久しぶりの参加。
PHP Manualを上から読んでる
11/30~ こどおじ -> 渋谷
Shibuya.js, Shibuya.devをつくろうとするも両方すでにあって無事終了。
Sakuragaoka.devで検討中
yebis0942yebis0942.icon
JSConf.jpのLT proposalが通過しました!
https://jsconf.jp/2022/talk/seeking-technology-to-make-ecmascript-specifications-readable-to-everyone
https://github.com/tc39/proposal-string-dedent
tarsさんが出そうと思ったら、同じものがすでにstage2に来ていた
code:rb
# rubyのheredocの便利修飾みたいな
puts <<~HERE
ここの左のスペースが消える
HERE
前回のあらすじ
NaNはfiniteなのか問題
FYI
前回、NaN は finite なのか?みたいなハナシで、たぶん finite ではないだろうとなっていましたが、念のため確認しました 👍
結論としては、その理解であってた & finite の定義の Others は NaN と +∞, -∞ という3つの Special Values 以外のことだと教えてもらった
from Discord by tarsさん
IsLooselyEqual
x と y の型が一緒の時は IsStrictlyEqual のほうが使われる!
IsStrictlyEqual
abstract operaion 多すぎ問題
全部読んでも覚えていられないので、気になるものだけ読んでいく形でいきたい
GetMethod (V, P)
名前通り
V のメソッド P をGet するやつ
P が Callable じゃなければ throw
HasProperty (O, P)
名前通り
prototype chain をさかのぼる
Array でよく使われているっぽい(array の各要素の取得に使われている)
Array.prototype.forEach
code:js
// length があれば forEach がよべる!
const ary = {
length: 5,
0: 0,
1: 1,
2: 2,
4: 4,
}
Array.prototype.forEach.apply(ary, [(v, i) => {
console.log(v, i);
}]);
// 0 0
// 1 1
// 2 2
// 4 4
0 in ary
// true
1 in ary
// true
3 in ary
// false
const ary2 = {};
// undefined
Object.setPrototypeOf(ary2, ary);
// {}
0 in ary2
// true
__proto__ってどういう効果があるんだろう
プロトタイプチェーンの読み書き
Object.setPrototypeOfなどのメソッドを使うのが標準的っぽい
Prototypeは仕様上はO.[[Prototype]]というinternal slotに保存されている
Chromeのdevtoolではこのinternal slotを覗ける
では__proto__は?
optionalでlegacyな仕様として規定されている(実装しなくてもよい挙動)
内部的にはObject.setPrototypeOf, Object.getPrototypeOfに相当する処理を呼び出すsetter, getterとなっている
OrdinaryGetOwnProperty
stepに"own property"という用語が出てくる
調べてみると定義されていた→https://tc39.es/ecma262/#sec-own-property
property, own property, inherited propertyなどの定義がある
yebis0942.icon定義があるけどリンク貼られていない語というのが割とあるらしい…?
property descriptorをコピーしてから返している
直接値を返すと、その値を変更するだけでpropertyの性質を変えてしまえるからか
HasOwnProperty
Object.hasOwnで使われている
ES2022で追加されたメソッド
Object.prototype.hasOwnPropertyを置き換えるもの
https://sosukesuzuki.dev/posts/stage-3-object-hasown/
someObj.hasOwnPropertyが独自に書き換えられている可能性があるので以下のようなワークアラウンドが必要になっていた
code:workaround.js
const hasOwn = (o, k) => Object.prototype.hasOwnProperty.call(o, k)
hasOwn({ a: 1 }, 'a')
// true
const hasOwn = Object.prototype.hasOwnProperty
hasOwn.apply(b, "c");
// true
code:hasOwnPropertyIsChanged.js
const a = {
hasOwnProperty: () => { return 1 }
}
const b = {};
Object.setPrototypeOf(b, a)
b.c = "c";
b.hasOwnProperty('c')
// 1
Object.hasOwn(b, "c")
// true
Call
Ordinary objectのcallを覗いてみた
複雑そうなのでスキップ
追っていくとカバー文法が再登場してきた
CoverCallExpressionAndAsyncArrowHead
code:js
async()
// ここだけ見ると「asyncという関数を呼ぶ」なのか「asyncな関数を定義する部分の始まり」なのか分からないということなのか(yebis)
文法定義の$ _{\lbrack \rm{?await} \rbrack}とかは何者?
生成規則の略記
「async () => {}はだいたい普通のarrow functionと同じだが、awaitをキーワード扱いしたい」みたいな仕様を簡潔に記述するために導入された
常にキーワード扱いしてしまうと、async/awaitの導入前のコードが壊れてしまう
ref. 予約語一覧: https://tc39.es/ecma262/#sec-keywords-and-reserved-words
conditional keyword, or contextual keyword というのがある
Keywords and Reserved Words
a. 常に識別子として使えないもの: ReservedWords
ただしawaitとyieldは例外
b. 文脈によっては識別子として使えないもの: awaitとyield
c. strict modeでは識別子として使えないもの: let, static, implements, interface, package, private, protected, and public
d. 常に識別子として使えるが、Identifierが許可されない場所ではキーワードになるもの: as, async, from, get, meta, of, set, target
meta -> import.meta
target -> new.target
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/new.target
b〜dはconditional keywordやcontextual keywordと呼ばれる
new.targetの使い方
code:typescript
function ConstructorA () {
if (!(this instanceof ConstructorA)) {
console.error('Must be called as a constructor')
}
}
function ConstructorB () {
if (!new.target) {
console.error('Must be called as a constructor')
}
}
Construct
classはECMAScriptの仕様書ではどういう扱いなのか
クラスはただのオブジェクト
オブジェクトのコンストラクタを定義するためのsyntax sugarとしてclassキーワードが提供されている
ClassTailでかすぎ問題
ClassTailの中にClassBodyがある
https://tc39.es/ecma262/#prod-ClassTail
class定義の中にconstructorがない場合の処理を追っていったところでタイムアップ
次回どうするか
もとに戻って先に進む
ClassDefinitionEvaluationを全部読む
こちらで!