初めに 以下のコードはstateの値が変わった時どのような動作をすると思いますか？ 本質ではないのでclearInterval等の処理は省略しています。 const [x, setX] = useState(0); useEffect(() => { setInterval(() => { console.log(x); }, 1000); }, []); このコード、思うようには動かずstateの値が変わってもずっと0が出力され続けます。 何故でしょうか？JSのクロージャをある程度理解している人なら分かると思います。 コンポーネント関数が呼ばれた時の動作を考えてみましょう。 初回呼び出しではuseState(0)を呼ぶとxに0という値が入ります。 useEffectのコールバックも呼び出されます。この時setIntervalのコールバックはxという変数をキャプチャしています。 2回目以降の呼び出しではxは現在のstateです(このコードだけでは具体的な値は分からない) useEffectの第二引数が[]なのでコールバック

tc39のリポジトリを中心に気になる提案をまとめます。 do expressions(stage-1) リポジトリ https://github.com/tc39/proposal-do-expressions 概要 関数型言語のようにifやtry、switchなどを式のように扱えるようにする為にdo式を追加しようという提案です。 例 let b = true; let x = do { if (b) { 'hoge'; } else { 'foo'; } }; assert(x === 'hoge'); その他 「doいらなくね？普通にifなどを式として扱おうぜ」みたいなissueがあがっています。 https://github.com/tc39/proposal-do-expressions/issues/9 何故これではダメなのかはよく分かりません。後方互換性的な問題があるのでしょうか？ optional chaining(stage-1) リポジトリ https://github.com/tc

bind operatorとは func.call(obj)をobj::func()と書けるシンタックスシュガーです。 ::obj.funcと書くとobj.func.bind(obj)となる構文もありますが今回は不要なのでスルーします 今までのJavaScript ここでは例として引数の文字列を2倍して返す関数twoを作ります function two(str){ return str+str; } 呼び出し two('x');//'xx' 問題点 この程度なら特に問題はありません。 しかし、文字列加工の処理などで以下のような事になってしまう事ありますよね？ z(y(x(str))); まず括弧の対応が分かりにくいです。 そして関数はx→y→zの順に呼び出されるのに、見た目はz→y→xと逆になってしまいます。 プロトタイプ拡張は？ 名前の衝突などの危険があるので使いたくない。 bind operator function two(){ return this+this; } 呼び出し "x"::two(

構文エラー ()=>{x:1} 長い ()=>{return {x:1};} こうしよう ()=>({x:1})