ECMAScript仕様輪読会 #3
前回: ECMAScript仕様輪読会 #2
Scrapboxの招待リンク: https://scrapbox.io/projects/esspec/invitations/85b96c9fa718ce5185e307196ed8fb53
connpass: https://esspec.connpass.com/
Discord: https://discord.gg/59S3y6weQj
Twitter hashtag: #esspec
読むもの
読み方について読む
https://timothygu.me/es-howto/
https://v8.dev/blog/understanding-ecmascript-part-1
ECMA 262: https://www.ecma-international.org/publications-and-standards/standards/ecma-262/
ECMAScript 2021 仕様書: https://262.ecma-international.org/12.0/
読みたいもの
completion record についての詳細
https://tc39.es/ecma262/#sec-completion-record-specification-type
abrupt completion についての詳細
constructor / prototype 周りの話
Function との兼ね合い、class構文の定義など
読んでおいた方が便利そうなもの
6.1 ECMAScript Language Types
Syntax-Directed Operationsnoyan.icon
話したいこと
来週からZoomにしようかな…と若干思ってます
そのままYouTube Live出来るので
Discord か Slack かなんかが欲しいと思ってます
Discord用意しました: https://discord.gg/59S3y6weQj
スケジュール
19:30 集合、自己紹介
20:50 ~ 21:00 休憩
22:00 終了
https://www.youtube.com/watch?v=I0snsrYwsME
自己紹介
syumai
Twitter: https://twitter.com/__syumai GitHub: https://github.com/syumai
仕事でNext.jsやったり、Go書いたりしてます
Goの言語仕様の輪読会が終わったので、勢いでこれを開催しました
Nozomu Ikuta
Twitter: https://twitter.com/NozomuIkuta
GitHub: https://github.com/NozomuIkuta
Vue/Nuxtのスタック中心に仕事をしています
asazu taigaasazutaiga.icon*4 (あとで)
https://twitter.com/asazutaiga
仕事でReact, TypeScriptを使っています
JSは2年くらい書いてます
JunYasumura Jun Yasumura.icon
https://twitter.com/harupiyo 不活発
趣味はCommon Lisp
HTMLの仕様書を読んだ経験あり
2021年12月からフロントエンドの勉強を始めたばかり
英語苦手!
noyannoyan.icon
Reactが大好きです。React内部のコードリーディングに時間を溶かしていました
言語仕様書を読むのは初めてなので緊張しています…!
最近はChakra UIのEslint Pluginのコラボレーターになりました
yebis0942yebis0942.icon
Reactたまにやってます
最近はChrome DevTools Protocolのクライアントについて調べたりしてます
初期の設計上の判断を知りたいけどどこを漁ればいいんだろう
おーみー (あとで)
Twitter: aumy_f GitHub: aumyf
高校生です。趣味でReact, F#, Kokaなどをいじって遊んでいます
プログラミング言語に興味があります
JSはだいぶ前から少しずつ書いてました。ES2015以降が主です
最近は友人のNext.js個人開発を手伝っています
tars0x9752 (たーず / naoki aoyama)
GitHub: https://github.com/tars0x9752
ブログ: https://tars0x9752.com/
Matrix: @tars0x9752:matrix.org
仕事ではwebアプリ・モバイルアプリ開発のフロントエンド~バックエンドをTSで書いたりしてます。
普段英語を人前で話す機会とかは全然ないので、発音とかお聞き苦しいかもですが、ご容赦ください。(がんばります)
プルリクチャンス
誤植
> > console.log(Object.getOwnPropertyDescriptor([], "length"));
{ value: 1, // => 0 または、[]はarr
リンク切れ
most undesirable features in JavaScript
元リポジトリは生きてる
議事メモ (余裕があれば)
次回どこを読むか
typeofを読んでみた
初見だと新概念がどんどん出てきていろいろなところにジャンプしないといけない
なかなか大変
scrapboxに書き溜めていた読みたいリストから読んでいきたい
6章あたりよさそう
基礎知識を得るのによさそう
Discord か Slack かなんかが欲しいと思ってます
Discordでよさそう
matrix
TC39 beginnerコミュニティがあって質問とかできるかも
Twitterコミュニティ
Twitterアカウント持ってない人がいるかも
How to Read the ECMAScript Specification by Timothy Gu
前回の続きから。
2.5. JavaScript Objects
古典的なオブジェクト指向で考えると
Objectはインターフェース
internal methodsは実装されるべきメソッド
ordinary objectはデフォルトの実装を持つ
exotic objectはその実装を上書きしている
internal slotsはインスタンス変数
UML: (継承元)←(継承先)
2.6. Example: String.prototype.substring()
String.prototype.substring.call(undefined, 2, 4)を実行したらどうなるか
=thisがStringじゃなくてundefinedだったら何が起きるか?
参考: Function.prototype.call(foo, args...) -> 関数のthisをfooにしてargs...を引数として呼び出す
💡仕様書の左上の検索ボックスでいい感じにインクリメンタル検索できる
[2, 4): 左閉右開区間
RequireObjectCoercible
nullとundefinedだけTypeErrorになる
数値やNaNは通る
code:try.js
String.prototype.substring.call(1, 2, 4) // "" (変換後の文字列の長さが短いので空文字列)
String.prototype.substring.call(NaN, 2, 4) // "N"
エラーメッセージのテキストは実装依存
Firefoxのエラーテキスト: TypeError: can’t convert undefined to object
(コメント) 仕様を知らないといきなりオブジェクト変換の話をされてもよくわからないかも
ChakraCore: Chromiumベースになる前のEdgeで使われていたJSエンジン
suin・読者1万人『サバイバルTypeScript』公開中!(@suin)
ブラウザとレンダリングエンジンとJavaScriptエンジンとECMAScriptの関係図(清書版)
https://pbs.twimg.com/media/FGNJHXeVkAA0qmQ.jpg
(英語) plausible: もっともらしい
(英語) normative specification: 標準仕様
2.7. Example: Can Boolean() and String() ever throw exceptions?
「ビルトイン関数は例外を投げるのか?」
ミッションクリティカルなコードではよくある問い
Boolean()が例外を投げるのか調べてみよう
step1: !が使われている→例外は発生しない
step2: newなしの呼び出しではNewTargetは常にundefined→ここでbを返して正常終了する
NewTarget: new Foo()とFoo()を区別するために導入された
JavaScriptコードのnew.targetと同じ
結論: Boolean()は絶対に例外を出さない
深掘り: new Boolean()では例外は発生する?するとしたらどんな場合?
step3: ? OrdinaryCreateFromConstructor(...)
Assert:
https://tc39.es/ecma262/#sec-algorithm-conventions
Such assertions add no additional semantic requirements and hence need not be checked by an implementation.
処理系の動作には影響しない
? Get(constructor, "prototype")
Return ? O.[[Get]](P, O).
ordinary objectのO.[[Get]]では例外発生しないはず
[[Get]]が改変されているexotic objectでは例外が発生する可能性がある
there isn't a ? or ! shorthand for this step
step 1では! shorthandが使われてるのではyebis0942.icon
この!はshorthandではない…?
https://github.com/TimothyGu/es-howto/issues/13
ToBooleanに後から!が追加されて間違いになってしまったっぽい
step3で謎の括弧が出てきた
« BooleanData »
https://tc39.es/ecma262/#sec-list-and-record-specification-type これ?
For notational convenience within this specification, a literal syntax can be used to express a new List value. For example, « 1, 2 » defines a List value that has two elements each of which is initialized to a specific value. A new empty List can be expressed as « ».
リストのリテラルらしい
String()が例外を投げるのか調べてみよう
(コメント) step 4の?AbsOp1( ?AbsOp2 () )というネストした書き方おもしろい
Example 10
spec stack trace: 今の仕様と違うところがありそう
2例目
文字列を返してもアウト?
関数を返す必要があるからですね
5例目
Symbol.toPrimitiveの使いみち
初めて見た
Symbol.iteratorはみんな知らずにお世話になってそう
どこまでがプリミティブ?
オブジェクト以外はプリミティブ
プリミティブはメソッド呼び出しをするとオブジェクトに変換される
"most undesirable features in JavaScript"のリンク切れてた…
リポジトリは生きてる
(英語) ever: 強意?
「いったい例外を投げるのだろうか」みたいな感じ?
(英語) forefront: 前線
(英語) oft-pondered: しばしば考えられる
oft (=often) + pondered
(英語) we shall ... : ...してみましょう
(英語) the spec equivalent: 仕様上等しいもの
(英語) tell-tale: 告げ口屋
「例外を投げることを明かしてくれるshorthand ?」という意味のような気がするyebis0942.icon
typeofはTODO
完
typeofの仕様を見てみよう
出発点: https://tc39.es/ecma262/#sec-typeof-operator
Reference Record
[[Base]]
Environment Record: 変数のスコープっぽい
[[Referencedname]]
プロパティ名
[[Strict]]: strictモードならtrue
[[ThisValue]]:
IsUnresolvableReference(val)
解決できない参照とは?
未定義の変数とかの話をしてそう