Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 2021 / 2020 / 2019 JavaScriptライブラリのトレンドを紹介しているbestofjs.orgが、2020年に最もホットであったJavaScriptライブラリのランキングを発表しました。 選考基準は現在のスター数ではなく、『2020年の一年間で増えたスターの数』です。 過去流行っていたけど落ち目となった技術は出てこないので、最近注目されている技術がわかります。 ちなみに2016年の総合ランキング1位はVue.js、2017年の総合ランキング1位はVue.js、2018年の総合ランキング1位はVue.js、2019年
ESLintはJavaScriptを静的に検証するツールです。 わかりやすく言えば、チームメンバー間で統一された美しいコードを生成するためのツールです。 設定ファイルを書いておけば自動で変換することも可能です。 ESLintを始めよう! JavaScriptのLintツールにはjslint, jshint, JSCSなどがあります。 2016/11 時点で npm trendsで比較した結果が以下の画像です。 http://www.npmtrends.com/jslint-vs-jshint-vs-jscs-vs-eslint 半年前はjshintと並んでいましたが、わずか半年の間にダブルスコアをつけています。 jshintは開発が鈍化しています。 またJSCSの開発チームはESlintに移行することを決めました。 以下に記載した有名ライブラリは開発時にESLintを使っています。 jQu
JavaScriptプログラムの基本的な構成要素のひとつが演算子です。多くの方が普段のJavaScriptプログラミングで演算子を使っているでしょう。 では、あなたは「演算子とは何か」という問いに答えられますか? 演算子と演算子以外の違いはどこにあるのでしょうか? 演算子とは何かという定義は、人によって考え方が違うでしょう。筆者の個人的な考えとしては、演算子は「1つ以上の式から別の式を構成する構文を特徴づけるトークン」であると考えています。 しかし、JavaScriptには仕様書があります。仕様書はJavaScript (ECMAScript) に関する最も信頼できる情報源ですから、何が演算子で何が演算子でないのかについてもたいへん強力な基準を与えてくれることが期待できます。 そこで、この記事では何が仕様書で演算子と呼ばれているのかについて全て解説します。併せて、演算子っぽいけど演算子とは
Google Apps Scriptというと以前はWebのエディター上でしかコードを書けなかった。 手に馴染んだエディタが使えないし、バージョン管理はしにくかった。 Googleからclaspが登場し開発環境は大幅に改善された。 利用バージョン: clasp v1.1.5 インストール npm コマンドでインストールできる。 npm i clasp でインストールすると以前は別モノがインストールされたが、今は An alias for @google/claspと書かれており単にclasp のみでも良さそう。 ログイン Webエディタ側から取るにも、Webエディタ側にアップするにもユーザ認証が必要ということで、まずはログインする必要がある。 ログインする前には Google Apps Script API を有効にしておく必要もある。 https://script.google.com/h
対象読者 ES6を詳しくは知らない なんとなくJavaScriptを書けるけど、JSのthisの特性についてまだよく知らない アロー関数式を知らない、または知っているけど実装経験がない 概要 JavaScriptのES6で導入されたアロー関数式を、関数のただのシンタックスシュガーに過ぎないと思っていたのですが、調べてみると実際そうではないようだったので、thisの話と一緒にまとめてみました。 アロー関数式とは ES2015(ES6)から利用可能になった新しいJavaScriptの構文の一つです。 ES6とは、2015年に標準として策定されたJavaScriptの新しい文法です。 ES6では他にも、letによる変数宣言が可能になったり、promiseという非同期処理の実装ができるようになったりと、アロー関数式以外にも様々な構文追加がありました。 さて、この記事の主題はそのなかでもアロー関数な
概要 AltJS としての言語 TypeScript の特徴をかいつまんで説明します。 対象者 JavaScript でコードを書いたことがある。 JavaScript でプログラムを書くのが辛い or もっと楽したい。 TypeScript ってなに?聞いたことはあるけど・・・ ・・・な人。 TypeScriptの参考資料 TypeScript - JavaScript that scales. (公式サイト) TypeScriptってどんなもの? プロ生ちゃんと始めてみよう! - Build Insider Insider.NET > TypeScriptで学ぶJavaScript入門 - @IT TypeScriptの型入門 - Qiita ワイ「いうても型なんて面倒くさいだけやろ?」 - Qiita TypeScriptの型入門 - Qiita AltJS (Alternative
はじめに 今更ですが、JavaScriptのasync/awaitに関する備忘録になります。 「今まで$.Deferred()やPromiseなどで非同期処理は書いたことがあるが、async/awaitはわからない」 「$.Deferred()やPromiseなどの非同期処理の書き方より、もっと簡潔に書ける書き方があれば知りたい」 「今までの非同期処理の書き方と比べて何が良いのかわからない」 といった人達向けの記事です。 $.Deferred()やPromiseなどで非同期処理を書いたことがある前提のため、非同期処理自体に関する説明は記載しておりません。 記載している利用例のコードはChrome(最新)のコンソール上で動きますので、コンソール上で実行して動作を確認してみると理解が深まりやすいと思います。 本記事で用いている用語 Promiseを返す Promiseオブジェクトを返すこと。
ということで、前回に引き続きReact Confで紹介されてたものを試すシリーズの第二回です。 flowの簡単な設定とeslint/babel/precommitフック/vimとの連携のみです。深い使い方は(今のところは?)書きません。flowは既に色々なところで紹介されてますが、気にせず行きます。 ちなみに今回もReactは出てきません。(追記で少しだけ触れてしまいました) flowとは JavaScript用のtypeチェッカー ファイル単位で適用できるため、既存のプロジェクトにも気軽に導入できる eslintやbabelとも連携できるので既存プロジェクトに導入しやすい 色んなエディタ/IDEでもサポートされている この辺を見る限りFacebookのデベロッパ的にはTypeScriptはあんまり推奨してないっぽい GitHubのstarヒストリーを見る限りはTypeScriptに分があ
はじめに 今更ですが、ES2015(ES6)で追加された機能や構文に関する備忘録です。 「JSは書けるけどES2015(ES6)はわからないっす...!」といった人達向けの記事です。 入門記事のためイテレータやジェネレータ等のわかりづらかったり、 説明が長くなりそうな機能や構文は割愛しております。 ES2015(ES6)とは ECMASCriptの6th Editionのこと。ECMAScript 6th editionの6を取ってES6と呼ばれていたが、 2015年に標準化されたため正式名称はES2015になった。 正式名称がES2015ならES6という名称を使うのは間違いなのか どちらの名称でも問題はない。 ES6の名称の方がエンジニアコミュニティに中では浸透しているらしく、ES6と記載されていることが多い。 詳細は以下を参考。 ES6 or ES2015 ? 〜WEB+DB PRES
Access to XMLHttpRequest at 'http://localhost:8081' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is ther
そう、JSON にはコメントを記載するための構文がないのです。近年では設定ファイルなどで利用されることも多い JSON ですが、コメントによる説明が不要なキーを名付けることは現実的ではありません。どうしよう、困ったな。 TL;DR コメントをつけるだけなら JSONC を使いましょう。 (2020-02-17追記) 各フォーマットの比較などに使えるデモページを公開してみました。 (2020-03-15追記) 続編を書きました。 どうしても JSON にコメントを書きたい 同じようなことに悩む先人は多いため、インターネット上には様々なアイデアが提案されています。 たとえば JSON Schema Core Draft 2019-091 では以下のような記述があります: 8.3. Comments With "$comment" This keyword reserves a location
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? お知らせ(2020/08/25 追記) Udemy で「webpack 最速入門(10,800 円 -> 2,000 円)という講座を公開しました。 本来の価格は10,800円ですが、上記リンクからアクセスすると2,400円で購入できます。 どんな内容? webpack を利用したフロントエンド開発環境が構築できるようになる、ハンズオン形式の講座です。 詳細は上記のリンクのプレビュー動画で詳しく説明しています。 記事との内容の違い 記事の内容に、以下の内容や特徴が追加された感じです。 実務で利用できる開発環境を徐々に構築していくので、記
$(document).ready(function() { $("#registrationForm").validate({ errorClass:'error', errorElement:'span', highlight: function (element, errorClass, validClass) { $(element).parents("div[class='control-group']").addClass(errorClass); }, unhighlight: function (element, errorClass, validClass) { $(element).parents(".error").removeClass(errorClass); }, rules: { username: { required: true }, email: { r
コールバック地獄を解消するPromiseパターン Promiseは非同期処理のデザインパターンの一つです。非同期処理関数の戻り値として「処理の途中」を意味するオブジェクトを返す事で、かゆいところに手を届くようにします。ちなみに言語によってはFutureと呼ばれることもあります。(参考: future - Wikipedia) 言語によって何が利点になるかは微妙に異なりますが、JavaScriptではコールバック地獄を抑止できる事が大きいでしょう。 JavaScriptでよく見られる非同期処理は、処理結果をコールバック関数で受けるパターンですね。標準APIでも頻繁に用いられています。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く