タグ

javascriptに関するhohoho_ho2005のブックマーク (1,066)

  • JavaScript界隈の基本的な用語を歴史とともにさらにまとめてみた - Heppoko Binbo Yarou no Newbie Nikki

    2018/12/23 リンク切れしていたものを削除 & リンクを追加 https://qiita.com/sinsengumi/items/e20342d13cbdd7ac2304 を読んで、すこしだけもやもや感がぬぐえなかったので、適当に自分が思ってる「今のJavaScriptはこんなかんじ」というのを書いた。 EcmaScript だいじなこと EcmaScriptとは、プログラミング言語ではない。 EcmaScriptとは、Ecmaインターナショナルが決めているJavaScriptの言語仕様のこと。 Ecmaとは、European Computer Manufacturers Association の略で、要は世界のコンピュータ関連の仕様を決めてる闇の組織みたいなところ。 (→History of Ecma) なんでEcmaScriptとかいうものがあるのか? 大昔、JavaScr

    JavaScript界隈の基本的な用語を歴史とともにさらにまとめてみた - Heppoko Binbo Yarou no Newbie Nikki
  • JavaScriptのモダンな書き方 - ES2017〜ES2018のawait・async, includes(), padStart()等を解説 - ICS MEDIA

    JavaScriptのモダンな書き方 - ES2017〜ES2018のawait・async, includes(), padStart()等を解説 ECMAScript 2015がリリースされて以降、JavaScriptの機能は大きく強化されました。const/let、アロー関数、クラス構文、Promiseなどが有名なところですが、ES2016、ES2017、ES2018、・・・ES2022、そしてさらにその先へJavaScriptの仕様は日々進化しています。JavaScriptTypeScriptの開発では、これまで当たり前だと思っていた手法を新しい新機能で置き換えることが何度もありました。 記事では、JavaScriptのモダンな書き方について説明します。おもに2017年から2018年頃に搭載されたES2017・ES2018の機能について焦点を当てて解説します。 非同期のProm

    JavaScriptのモダンな書き方 - ES2017〜ES2018のawait・async, includes(), padStart()等を解説 - ICS MEDIA
  • JavaScript の仕組み:メモリ管理+ 4つの共通のメモリリーク処理方法 - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? この記事は sessionstack blog に投稿されている、How JavaScript works シリーズの一記事 "How JavaScript works: memory management + how to handle 4 common memory leaks" の和訳です。投稿されたのは Alexander Zlatkov, 原文はこちらです。翻訳については許諾いただいています。 メモリ管理もしくはC言語におけるメモリ解説他、用語なども怪しい箇所は多分にありますので、間違いがありましたら修正のご指摘・編集リクエス

    JavaScript の仕組み:メモリ管理+ 4つの共通のメモリリーク処理方法 - Qiita
  • JavaScript ( 時々 TypeScript ) で学ぶ関数型プログラミングの基礎の基礎 #1 - 高階関数について | Recruit Tech Blog

    前置き ( ※ 読み飛ばしていただいても OK ) JavaScript は関数型ライクなエッセンスを一部含んではいるものの、決して Haskell のような純粋関数型言語ではありません。JavaScript では変数やオブジェクトの状態を自由に書き換えるようなプログラミングスタイルを通常としているからです。したがって JavaScript で関数型プログラミングをまともに行うのは来ナンセンスなのかもしれません。しかし関数型の持つ要素の一部だけを取り入れたプログラミングをすることは可能であり、これらを習得することは大規模かつ堅牢な web アプリケーションを設計するのに少なからず恩恵をもたらします。また、 JavaScript には Underscore.js / Lodash や Immutable.js、 Ramda.js といった便利なリスト操作ライブラリや RxJS のような非同

    JavaScript ( 時々 TypeScript ) で学ぶ関数型プログラミングの基礎の基礎 #1 - 高階関数について | Recruit Tech Blog
  • ECMAScript 2015以降のJavaScriptの`this`を理解する

    この記事はJavaScriptの入門書として書いているjs-primerのthisに関する部分をベースにしています。 またjs-primerでは書けなかった現在時点(2018年1月1日)でのブラウザの挙動についてを加えたものです。 次の場所にjs-primer版(書籍版)のthisについての解説があります。 この記事と違って実際にコードを実行しながら読めるので、学習ソースとしては書籍版を推奨します。 書籍版: 関数とthis · JavaScriptの入門書 #jsprimer また、バグ報告やPRも直接リポジトリにして問題ありません。 asciidwango/js-primer: JavaScriptの入門書 おかしい場所を選択した状態で右下にある”Bug Report”ボタンを押せば、簡単にtypoとかのバグを報告できます。(PRでも歓迎) 前置きはこの辺までで、ここから編。 この記

    ECMAScript 2015以降のJavaScriptの`this`を理解する
  • イマドキのJavaScriptの書き方2018

    PySpa統合思念体です。これからJavaScriptを覚えるなら、「この書き方はもう覚えなくていい」(よりよい代替がある)というものを集めてみました。 ES6以降の難しさは、旧来の書き方にプラスが増えただけではなく、大量の「旧来の書き方は間違いを誘発しやすいから非推奨」というものを作り出した点にあります。5年前、10年前のやウェブがあまり役に立たちません。なお、書き方が複数あるものは、好き嫌いは当然あると思いますが、あえて過激に1つに絞っているところもあります。なお、これはこれから新規に学ぶ人が、過去のドキュメントやコードを見た時に古い情報を選別するためのまとめです。残念ながら、今時の書き方のみで構成された書籍などが存在しないからです。 たぶん明示的に書いていても読み飛ばす人はいると思いますが、すでに書いている人向けではありません。これから書くコードをこのスタイルにしていくのは別にいい

    イマドキのJavaScriptの書き方2018
  • ES2015を覚えるならコレ!ES2015のおすすめ学習リソース一覧 ~0からreact習得記 day 04~

    terminalで入力して実行結果を確認してください。 問題文だけが記述されているのではなく、ES5との比較や学習項目の内容も丁寧に説明されているのでとても分かりやかったです。 どうしても答えが分からない時は、https://github.com/yosuke-furukawa/tower-of-babelの exercises/各レッスン/solutions/の中の.jsファイルに記述されています。 NodeSchool NodeSchoolとはJavaScriptやそれに関連する技術を無料で学ぶ事の出来るオープンソースのツールです。名前にNodeと入っていますが、学べる科目はNodeだけではなく、JavaScriptに関連した様々な科目を学ぶことが出来ます。先程紹介したTower of BabelもNodeSchool内の科目の一つです。学びたい科目を一度ホームページから探してみるの

    ES2015を覚えるならコレ!ES2015のおすすめ学習リソース一覧 ~0からreact習得記 day 04~
  • JavaScriptスタイルガイド 1〜8: 型、参照、オブジェクト、配列、関数ほか (翻訳)|TechRacho by BPS株式会社

    1〜8: 型、参照、オブジェクト、配列、関数ほか -- 記事 9〜14: クラス、モジュール、イテレータ、プロパティ、変数、巻き上げ 15〜26: 比較演算子、ブロック、制御文、型変換、命名規則ほか 概要 AirbnbによるJavaScriptスタイルガイドです。 MITライセンスに基いて翻訳・公開いたします。 英語スタイルガイド: airbnb/javascript: README.md 更新日: 2017/09/08 著者: Airbnb github.com/airbnbより 凡例 原文にはありませんが、利便性のため項目ごとに目安となる分類を【】で示しました。 【必須】【禁止】:従わないと技術的な悪影響が生じる 【推奨】【非推奨】:技術上の理由から強く推奨される、または推奨されない 【選択】:採用してもしなくてもよいスタイル 【スタイル】:読みやすさのためのスタイル統一指示 【知識

    JavaScriptスタイルガイド 1〜8: 型、参照、オブジェクト、配列、関数ほか (翻訳)|TechRacho by BPS株式会社
  • 入社からの半年間でコードレビューで指摘されたことのまとめ - 30歳からのプログラミング

    実務未経験でプログラマとして入社して半年以上が経った。 コードレビューで指摘されたことを備忘録としてまとめておく。 自分なりにまとめたものなので、レビュアーが言いたかったこととニュアンスや解釈がずれている可能性はある。 初歩的な内容ばかりで我ながらうんざりする。 せっかく優秀な同僚ばかりなのだからもっと高度なことを学びたいが、こういう初歩的なことが出来ないのが俺の現状なのだから、仕方ない。 そもそもPullRequestを送ったこともなかったわけだし。入社初日は、一人でPullRequestの出し方を練習していた。 それを考えればまあ、こんなものだろうか。 当たり前のことをちゃんと当たり前に出来るようになって、早く、次のステージに進みたい。 PullRequest(PR) PRのタイトルは分かりやすいものに。必要に応じてチケットの番号なども入れる。 コミットやPRは出来るだけ粒度を細かくす

    入社からの半年間でコードレビューで指摘されたことのまとめ - 30歳からのプログラミング
  • 正式リリースされたES8の主な新機能 ???? | POSTD

    EcmaScript仕様第8版の新機能 EcmaScript 8もしくはEcmaScript 2017が、6月末にTC39から正式にリリースされました。私たちはこの1年、EcmaScriptについて色々と議論しているようですが、それは無駄なことではありません。現在、ES標準は新しい仕様のバージョンが年1回公開されています。ES6は2015年、ES7は2016年に公開されましたが、ES5のリリース時期をご記憶でしょうか。JavaScriptが魔法のように普及する以前の、2009年のことでした。 つまり私たちは、安定した言語としてJavaScriptの開発上の変化をたどっており、今や自分の語彙にES8を加える必要があるのです。 ES2017 (the 8th edition of the JavaScript Spec) was officially released and publishe

    正式リリースされたES8の主な新機能 ???? | POSTD
  • Jest · 🃏 Delightful JavaScript Testing ドキュメント

    スナップショット機能で大きなオブジェクトを容易に追跡できるテストを作成できます。スナップショットはテストと一緒に、あるいはインラインに埋め込んだ状態で表示できます。

    Jest · 🃏 Delightful JavaScript Testing ドキュメント
  • javascript3分クッキング「不変オブジェクト」 - Qiita

    定義 不変オブジェクトとは精製後に状態が変更されないオブジェクトのことである。 広義には、状態を変更しないオブジェクトを不変オブジェクトと呼ぶ。 狭義には、変更しようにも変更できないオブジェクト、つまり変更禁止のために細工をしたオブジェクトを指します。 作り方 javascriptオブジェクトを不変オブジェクトにするには次のような手がある。 - プロパティ(状態)を隠し、変更操作を提供しない(jsにはプロパティを隠すために使える技法のひとつにクロージャがある) - ECMAScript第5版の関数を活用する - writable属性、configurable属性、セッター、ゲッターを活用する 関数で不変オブジェクト化 メソッド名 プロパティ追加 プロパティ削除 プロパティ値変更 確認メソッド

    javascript3分クッキング「不変オブジェクト」 - Qiita
  • ECMAScript6で書こう!WebPackとES6-loaderで環境を作り、ES6を先取り体験する方法 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    こんにちは。私事ですが、サイトリニューアルに伴いあだ名が変わり、「先生」となりました。(元博士) 降格になった訳ではありません。馴染まなかっただけです。 さて、ES5のブラウザ対応も広まり、ES6の話題がちらほらと出始めました。 ES6ではClassやConstが加わることとなり、これまでのJavaScriptの書き方も変わってくることでしょう。 というわけで早速ES6でコードを書いてみたいと思いますが、普通に書いたのでは動かないブラウザが多数です。 そこで日は、WebPackとES6-Loaderを使い、ES6で書きつつもES5にコンバートさせていく手順を紹介したいと思います。 インストールの前に開発ディレクトリを作ります。今回はこんな感じにします。 /es6 ┣ /node_modules ┣ /source ┗ package.json Node.js npmが使える状態になってい

    ECMAScript6で書こう!WebPackとES6-loaderで環境を作り、ES6を先取り体験する方法 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • lazyloadの解剖学

    Webのパフォーマンスを改善するテクニックとしてよく使われるlazyloadですが、一口にlazyloadといっても、その仕組みを解剖すると種類や実装方法は様々でした。今回はlazyloadを広義の『遅延読込』と捉えいくつかの視点から分類してまとめ、仕様に応じた実装方法について紹介します。 と言っても一般論ではなくあくまで持論なので、そこはご容赦ください🙆 (タイトルも盛りましたがご容赦ください🙅) lazyloadの対象 lazyloadのトリガー loadイベントのObserver 1. LazyloadComponent各々がScrollViewのスクロールイベントを監視する 2. ScrollViewが自身のスクロールイベントを監視する 3. 第三者(LazyLoadHandler等)がScrollViewのスクロールイベントを監視する LazyloadComponentの形式

    lazyloadの解剖学
  • JavaScriptフレームワーク選定の議論 - Qiita

    相談内容 既存の管理ツールを新しく作り直すために新しいJSフレームワーク/言語使いたいのですが、何を選んだらよいでしょうか? ここで選んだものは今後新しく作る時にも使用していく予定のため、学習コストよりメンテナンスしやすいものを選びたいと考えています。 利用者は社内外で特定の権限を持った人のみであるため、サーバサイドレンダリングはしない予定です。 言語は型があるものを利用したいのですが、TypeScriptとFlowのどちらがよろしいでしょうか? 時間に余裕があれば、テストフレームワークやビルドツールについてもお聞きしたいです。 現在のページ/チーム jQueryなどで書かれている部分が多いですが、変更を加えることが難しくメンテナンスコストが高いです。 サーバサイドをやってる人が片手間で書くJavaScriptといった状況です。 今回新規で数ページを追加する必要があるため、何を利用すれば良

    JavaScriptフレームワーク選定の議論 - Qiita
  • JavaScript の this を理解する多分一番分かりやすい説明 - Qiita

    JavaScript の this は、(他のプログラム言語から見ると) ちょっと面白い挙動に見えることがあります。 先日、この this の挙動について、会社の同僚が説明してくれたのですが、これまで聞いた説明の中で一番分かりやすいと感じたので、頑張って日語で説明してみます。 分かりにくかったら、多分それは私の技量不足。 this と function の関係 function が基準スコープになるのがまず一点。 その function をどう呼ぶかで変わるのかがもう一点。 それを踏まえて…… this は function を呼んだ時の . の前についているオブジェクトを指している と理解できるというのが、同僚の説明でした。 . が省略された場合はグローバルオブジェクトになります (non-strict モード時)。 strict モードでは undefined になります。(@ryo

    JavaScript の this を理解する多分一番分かりやすい説明 - Qiita
  • サービス終了のお知らせ

    サービス終了のお知らせ いつもYahoo! JAPANのサービスをご利用いただき誠にありがとうございます。 お客様がアクセスされたサービスは日までにサービスを終了いたしました。 今後ともYahoo! JAPANのサービスをご愛顧くださいますよう、よろしくお願いいたします。

  • JavaプログラマのJS忘備録[ES5] - Qiita

    はじめに 現在JavaScriptを学習中のJavaプログラマです。 既存の知識ベースを元にJavaScriptを体系的に学習しました。 そこで学習した事のうち、Javaとの差分を記録しました。 今後も知識が増えるたびに随時追記していきます。 記事のECMAScriptのバージョンについて ECMAScriptはEcma internationalが仕様を策定するJavaScriptの標準です。 このECMAScriptに則ることでその仕様に準拠する環境での動作が保証されます。 Babelといったトランスパイラの導入も含め、ES6の構文についての記事も別に書こうと考えています。 今回は、ES5までのJavaScriptについてまとめています。 ECMAScript5のstrict mode コードの先頭行に以下のディレクティブを書くと、strict modeとなります。 サポートされてい

    JavaプログラマのJS忘備録[ES5] - Qiita
  • Refactoring JavaScript

    If your JavaScript is a mess, frameworks can only do so much to help. No matter what framework, "compiles-to-JS" language, or library you use, bugs and performance concerns will always be an issue if the underlying quality of your JavaScript is poor. With this hands-on guide, you’ll learn how test and refactor your existing code to help reduce complexity, improve readability, and gain confidence i

  • JavaScript モジュールの現状 | POSTD

    (注:2017/07/19、いただいたフィードバックを元に翻訳を修正いたしました。) ESM、CJS、UMD、AMD  — どれを使うべき? 最近、 Twitter では、 ESモジュール の現状、特に、 *.mjs をファイル拡張子として導入すると決めた Node.js の現状について大騒ぎになっています。この話題は複雑で、かなりの労力を費やしてそれに専念しないと議論について行けないので、 皆が恐れと不安を抱く のも無理はありません。 古き恐れ フロントエンド開発者なら、 JavaScriptの依存関係の管理に悩まされた日々 を憶えている人も多いでしょう。あの頃は、ライブラリをベンダーフォルダにコピー&ペーストし、グローバル変数に依存し、あらゆる物を正しい順序でconcatしようとしてもネームスペースの問題に対処する必要がありました。 何年もかかって、私たちは共通モジュール形式と中央集権

    JavaScript モジュールの現状 | POSTD