LilPacy.info

快楽な不幸を捨て苦痛まみれの幸福を求める男の物語

未分類

JavaScript2021年個人的再考

投稿日:

jsについてあらためてインプットし直す機会があったため
気になったことを書き留めておく。

  • jsのデータ型
    • 変数の型はないが値の型はある
      • プリミティブな値
      • ビルトインオブジェクト
        • 全てのオブジェクトはObjectオブジェクトを継承
        • ブラウザ 880個
          • windowオブジェクト直下に生えている
        • node.js 87個
          • globalオブジェクト直下に生えている
      • typeof null -> ‘object’なのはバグがそのまま仕様に
    • そもそもjsにおいてclassめいたものはfunctionオブジェクトで定義されている
      • typeof Object -> ‘function’
      • typeof class {} -> ‘function’
  • jsの実行フロー
    • パース
      • ここでのエラーはSyntaxError
    • 実行
      • ここでのエラーはRuntimeError
  • jsのオブジェクト
    • 他言語のMapとは違う
    • データと機能の集合
      • プロパティ
      • メソッド
    • Mapとして使われることも多い
      • Object.create(null)でprototypeを削いで生成できる
    • es2015のMapオブジェクトの方が適切なこともある
  • プリミティブな値のprototypeメソッドへのアクセス
    • 暗黙的にラッパーオブジェクトへ変換される
    • よって全てがオブジェクトのように振る舞う
    • “”.toStringなど
  • 明示的な型変換
    • エラーにならないので極力避ける
      • NaNが返るなど
    • 代わりに?.と??の組み合わせを使う
  • NaNへの対処
    1. JsDoc
    2. throw
  • falseyとnullishのバリデーション
    • Screenshot - b0ce54fcf7ee6862e3412de57487fe3e - Gyazo
    • falseyは||、nullishは??でガードが書ける
    • &&はtruethy(falsey以外の値)だったら右側が評価される
    • ifで用いる場合は特に!!とかで明示的な変換は必要ない
  • thisの問題
    • 前提:そもそもメソッド内以外でthisを使わない
    • thisは基本的に定義ではなく呼び出しで値が決まる
      • 対策1:thisを明示
        • call,apply,bindなど
      • 対策2:thisを一時変数へ格納
      • 対策3:アロー関数を使う
        • アロー関数ではthisは静的に決まる
  • Mapオブジェクトの利点
    • オブジェクトをキーとすると参照単位でのマッピングが可能
    • つまり、map.get(item)で参照一致のオブジェクトが取れる
    • メモリリークの関係でWeakMapなどもある

js以外への気づき

  • コンストラクタ
    • 主にthisの初期化に使われるだけでnewした時に呼ばれる関数
    • thisの初期化以外も推奨はされないができる
  • golangのメソッド定義とjsのbind関数の関係
    • golangは構造体、jsのbindは個々のオブジェクトに振る舞いを束縛

ビルトインオブジェクト一覧

ブラウザ

          
          123
          Array.from(new Set(function f(o){return o?[...Object.getOwnPropertyNames(o).filter(n=>typeof o[n]==='function'),...f(Object.getPrototypeOf(o))]:[]}(window)))

(880) ["Object", "Function", "Array", "Number", "parseFloat", "parseInt", "Boolean", "String", "Symbol", "Date", "Promise", "RegExp", "Error", "AggregateError", "EvalError", "RangeError", "ReferenceError", "SyntaxError", "TypeError", "URIError", "ArrayBuffer", "Uint8Array", "Int8Array", "Uint16Array", "Int16Array", "Uint32Array", "Int32Array", "Float32Array", "Float64Array", "Uint8ClampedArray", "BigUint64Array", "BigInt64Array", "DataView", "Map", "BigInt", "Set", "WeakMap", "WeakSet", "Proxy", "FinalizationRegistry", "WeakRef", "decodeURI", "decodeURIComponent", "encodeURI", "encodeURIComponent", "escape", "unescape", "eval", "isFinite", "isNaN", "Option", "Image", "Audio", "webkitURL", "webkitRTCPeerConnection", "webkitMediaStream", "WebKitMutationObserver", "WebKitCSSMatrix", "XPathResult", "XPathExpression", "XPathEvaluator", "XMLSerializer", "XMLHttpRequestUpload", "XMLHttpRequestEventTarget", "XMLHttpRequest", "XMLDocument", "WritableStreamDefaultWriter", "WritableStream", "Worker", "Window", "WheelEvent", "WebSocket", "WebGLVertexArrayObject", "WebGLUniformLocation", "WebGLTransformFeedback", "WebGLTexture", "WebGLSync", "WebGLShaderPrecisionFormat", "WebGLShader", "WebGLSampler", "WebGLRenderingContext", "WebGLRenderbuffer", "WebGLQuery", "WebGLProgram", "WebGLFramebuffer", "WebGLContextEvent", "WebGLBuffer", "WebGLActiveInfo", "WebGL2RenderingContext", "WaveShaperNode", "VisualViewport", "ValidityState", "VTTCue", "UserActivation", "URLSearchParams", "URL", "UIEvent", "TreeWalker", "TransitionEvent", "TransformStream", …]

        

node.js

          
          1234567891011121314151617181920212223242526272829303132
          > Array.from(new Set(function f(o){return o?[...Object.getOwnPropertyNames(o).filter(n=>typeof o[n]==='function'),...f(Object.getPrototypeOf(o))]:[]}(global)))
[
  'Object',               'Function',       'Array',
  'Number',               'parseFloat',     'parseInt',
  'Boolean',              'String',         'Symbol',
  'Date',                 'Promise',        'RegExp',
  'Error',                'AggregateError', 'EvalError',
  'RangeError',           'ReferenceError', 'SyntaxError',
  'TypeError',            'URIError',       'ArrayBuffer',
  'Uint8Array',           'Int8Array',      'Uint16Array',
  'Int16Array',           'Uint32Array',    'Int32Array',
  'Float32Array',         'Float64Array',   'Uint8ClampedArray',
  'BigUint64Array',       'BigInt64Array',  'DataView',
  'Map',                  'BigInt',         'Set',
  'WeakMap',              'WeakSet',        'Proxy',
  'FinalizationRegistry', 'WeakRef',        'decodeURI',
  'decodeURIComponent',   'encodeURI',      'encodeURIComponent',
  'escape',               'unescape',       'eval',
  'isFinite',             'isNaN',          'Buffer',
  'atob',                 'btoa',           'URL',
  'URLSearchParams',      'TextEncoder',    'TextDecoder',
  'AbortController',      'AbortSignal',    'EventTarget',
  'Event',                'MessageChannel', 'MessagePort',
  'MessageEvent',         'clearInterval',  'clearTimeout',
  'setInterval',          'setTimeout',     'queueMicrotask',
  'clearImmediate',       'setImmediate',   'SharedArrayBuffer',
  'require',              'assert',         'events',
  'stream',               'constructor',    '__defineGetter__',
  '__defineSetter__',     'hasOwnProperty', '__lookupGetter__',
  '__lookupSetter__',     'isPrototypeOf',  'propertyIsEnumerable',
  'toString',             'valueOf',        'toLocaleString'
]

        

references

参考にしたかつわからなくなったら見るやつ

JavaScript Primer – 迷わないための入門書 #jsprimer
JavaScript – Speaker Deck(リクルート新卒研修資料)
JavaScript – JavaScriptのビルトイン関数もすべて見たい。|teratail

-未分類

執筆者:


comment

関連記事

no image

Mac/シェル/容量の大きなファイルを洗い出すコマンド

Macのターミナルから5GB以上のフォルダを洗い出すコマンド $ sudo du -g -x -d 5 / | awk ‘$1 >= 5{print}’ 参考 http://kayakuguri …

no image

wired.jpで使われているフォントの調査

wired.jpのフォントが好きなので何を使っているのか調査してみた。 結論 Helvetica Neue(英字)、游ゴシック(日本語)というのを使っている。 CSSの指定 font-family属性 …

no image

大抵のことはやらないというスタンス

関心は、「時間もかからないしとっととやってしまおう」と思ってやってしまうことの多くって意外と時間がかかったりするんじゃないかってこと。 そもそも かかる時間の見積もり = それぞれの手順 × それぞれ …

python/matplotlibで複数グラフを描く

6年毎のニューヨークの気温を比較 参考:Pythonからはじめる数学入門

no image

AIに代替されない仕事とは

今のところ、 毎回入力変数が変わる、変数が観測できない 毎回使うアルゴリズムが変わる (つまり法則性がない・弱い) 毎回正解が変わる、成功を測れない 以上のような仕事、とどのつまり、個別・特別なケース …