2018-07-02のJS: Firefox 61、ECMAScript 2018リリース、CSS4はどこにある？
JSer.info #390 - Firefox 61がリリースされました。 Firefox — Notes (61.0) — Mozilla Firefox 61 for developers - Mozilla | MDN Firefox 61 サイト互換性情報 | Firefox サイト互換性情報 TLS 1.3のサポートをデフォルトで有効化、アクセシビリティインスペクタの実装、 PerformanceServerTimingのサポートなどが行われています。 AvastやAVGを使っている場合にTLS 1.3での接続に問題が出るケースもあるようです。 1468892 - SSLERRORRXRECORDTOO_LONG with Avast intercepting TLS 1.3 connections またFetch APIのcredentialsのデフォルト値をomitからsa
とほほのReact入門 - とほほのWWW入門
React とは CDN インストールとアプリケーション作成と実行 ReactDOM.render() コンポーネントを定義する プロパティを渡す JSX の書き方 リストを表示する ステータスを変更する ルーティングでページを切り替える ユーザ管理画面サンプル リンク React とは SPA(Single-Page Application) を実現する JavaScript フレームワークの一つです。 Angular, Vue.js とよく比較されます。 Facebook 社によって開発され、Facebook の Web サイトでも利用されています。 2020年4月現在の最新バージョンは 16.13.1 です。 MITライセンスで公開されており、商用利用可能です。 JavaScript の中に直接 HTML/XML を記述する JSX という技術を利用しています。 JavaScript
ReactとVueのどちらを選ぶか - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 主に非Web系のバックエンド開発者(C/C++, Java, Python等を使用)がReactとVueをそれぞれ簡単に触れて、感じたメリット、思ったことなどをまとめています。 色々と書いてますが、どちらも完成度の高いライブラリ/フレームワークですね。 結論 JavaScript等にあまり深入りせずにWebアプリを簡単に書きたい、あるいは効率的に書くことが目的であればVueの方がお勧めです。しかし開発者としてスキルや設計などについて中長期的にレベルアップを図りたいのであれば、Reactから学ぶことをお勧めします。 何故かと言うと、Rea
アロー演算子の書式比較 - Qiita
Introduction Rubyのラムダ式でアロー演算子を覚えて使うようになりました．そんなある日，Groovyに手を出したのですが，アロー演算子によるメソッド定義の書式がRubyと異なるので「？」となって，色々な言語のアロー演算子の書式について調べてみました． 調べてみると，「ラムダ式」「アロー演算子」「アロー関数」「クロージャ」など呼び方も仕組みもさまざまであり，同じものとして扱って良いのか悩みましたが，せっかく調べたので公開します．この投稿内容では，『「=>」か「->」を使ってメソッド（のようなもの）を定義して変数に代入し，（メソッドのように）実行できる』ものを対象としています． 他にもアロー演算子によりメソッド（のようなもの）を記述できる言語はありますが，短時間で調べたので抜けがあります．ご指摘いただければ徐々に改訂していきたいと思っています．できればサンプルプログラムとともにご
webpack で始めるイマドキのフロントエンド開発 - Qiita
webpack とは webpack は WebApp に必要なリソースの依存関係を解決し、アセット（配布物）を生成するビルドツール（要するにコンパイラ）です。JavaScript だけでなく、CoffeeScript や TypeScript、CSS 系、画像ファイルなどを扱うことができます。 WebApp のビルドツールは Grunt や Gulp が有名です。これらは基本的に、ビルド手順をタスクという形で自ら定義する必要があり、フロントエンド開発に馴染みのない開発者にとっては敷居が高いものでした（少なくとも、自分はそうでした）。 webpack を使えば、Grunt も Gulp も必要ありません！覚えるべきことはほとんどありません。（必要なら）簡単な設定ファイルを書いて webpack コマンドを実行するだけです。 以下では基本的な使い方を見ていきます。 ※もちろん Grunt/G
npmとbrowserifyを使ったクライアントサイドのウェブアプリ開発
YoutubeとVimeoの検索結果のRSSをまとめてOPMLで取得できるサイトを作った | Web scratch で公開した Tech Video RSS Searcher はbrowserifyを使って作ったので、その辺の開発フローについての記事です。 browserify って何? browserify はNode.jsスタイルで書かれたモジュール(CommonJS)を ブラウザで利用できるように変換するコマンドラインツール(Nodeモジュール)となっています。 又、node.jsのCore Modulesのshimが用意されていて、 npmで公開されているnode.js向けのモジュールも一緒に変換してブラウザで動かすことが出来るようになっています。(普通に require で読みこめば勝手に変換されます) 原理的に無理だったり全てのモジュールが動くわけじゃないですが、 その辺の互
改めて理解するJavaScript Array / Understanding JavaScript Array // Speaker Deck
All slide content and descriptions are owned by their creators.
JavaScriptで数値フォーマットする標準API「Intl.NumberFormat」 (カンマ区切り、円・ドル表記、漢数字など) - Qiita
ほぼすべてのブラウザやNode.jsでサポートされている数値をフォーマットするAPI「Intl.NumberFormat」を紹介する記事です。 JavaScriptで数値をカンマ区切りにしたいときにGoogleで検索してみると、正規表現を使っていたり、ループで回して3桁ごとにカンマ付ける実装を紹介する記事を多く見つけました。 しかし、それらは古い記事ということもあり、2018年現在は数値のフォーマットを実装する必要はありません。EcmaScriptで仕様策定されておりほとんどのブラウザやNode.jsで使える関数があるので紹介します。 今回紹介するコードの実行結果はすべてChromeでの結果になります。 TL;DR 「Intl.NumberFormat.prototype.format」を使います。 まだChromeとFirefoxだけですが、「Intl.NumberFormat.prot
何故for文は許されるのか？反省会会場 - Qiita
祖父母記事: なぜfor文は禁止なのか？ポエム版 親記事: でもやっぱりfor文は使っていいと思うよ だって遅いんだもん こんなに遅いとは思いませんでした。 まさか1/6の速度しか出ないだなんて軽くショックです。 折角良いサイトhttp://jsben.chを教えてもらったので速度改善を目指して色々試行錯誤してみましょう。 この記事(反省会)では、速度も意識したメソッドチェーンのあり方を考えていきます。 メソッドチェーンはチューニングでどの程度速くなるのか それによる可読性はどの程度影響するのか 結局JSerはどう生きていけば良いのか 配列を生成するイディオムの速度比較 JSは配列作るのが下手くそですが、 メソッドチェーンや関数型プログラミング的な事をしたければ、 まずは速い数列(配列)を作るイディオムが必要です。 とりあえず4パターン用意してみました。 // length指定: 別の所で
ES modules: A cartoon deep-dive – Mozilla Hacks - the Web developer blog
ES modules bring an official, standardized module system to JavaScript. It took a while to get here, though — nearly 10 years of standardization work. But the wait is almost over. With the release of Firefox 60 in May (currently in beta), all major browsers will support ES modules, and the Node modules working group is currently working on adding ES module support to Node.js. And ES module integra
Node.jsとECMAScript Modules - hiroppy's site
Node.js のバージョン 10 のリリースは 4/25 を予定しています。 また、ECMAScript Modules は Stability1(実験的)でリリースされます。 議論は以下で行われます。 GitHub - nodejs/modules: Node.js Modules Team Node.js Modules Team. Contribute to nodejs/modules development by creating an account on GitHub. 覚えておくべきこと ESM を使いたい場合は、拡張子を.mjsにする .jsファイルでimport/exportは使えません。 ブラウザではtype="module"となりますが、Node.js では拡張子で判断します。 .mjsの拡張子は省略可能である 拡張子の探査順は ESM の時、.mjsが優先されま
\sが完全には空白文字を網羅できていなかった件 - Panda Noir
「空白文字」が世の中に何種類あるかご存じですか?半角スペース、全角スペース、タブ、改行くらいは分かると思いますが、実は世の中にはもっと空白文字があります。なんと空白文字だけで30文字以上もあります。これだけある空白文字を、/\s/は果たして網羅できているのでしょうか？今回はこれについて調べてみました。 '\s'にマッチするスペース文字の一覧 仕様書を見てみる '\s'と等価な正規表現とは？ 終わりに '\s'にマッチするスペース文字の一覧 2. スペースは" "だけじゃない的な話 ここのページに書いてあるスペース文字について、\sにマッチするか検証してみま した。 結論から書くと、\sは全てを網羅していませんでした。 青くなっている方が\sにマッチした文字、赤くなっている方がマッチしなかった文 字です。 名称文字 FILE SEPARATOR[�] GROUP SEPARATOR[�] R
JavaScriptとTypeScriptを共存させ、段階的に移行する方法
某サービスのフロントエンド開発に携わるようになってからずっと考えていることがある。 TypeScriptに移行して、型に守られたい！ ただ稼働しているサービスをいっきにTypeScriptに移行するのは危険で膨大な工数がかかるため、段階的に移行できないかと考えた。 ということでJavaScriptとTypeScriptを共存させる方法をまとめる。 環境は以下のとおり。 webpack@4.0.1 webpack-cli@2.0.9 webpack v3系の場合は不要 typescript@2.7.2 ts-loader@4.0.0 ※ あとでbabel-loaderについて追記予定です！ → 2018/03/23 追記しました 移行前の状態 極小サンプルを使って紹介する。 // src/main.js import { add } from './module' const result
イベントの作成と起動 - 開発者ガイド | MDN
この記事では、 DOM イベントを作成して処理する方法を説明します。このようなイベントは、一般に、ブラウザー自体によって起動されたイベントとは対照的に、合成イベントと呼ばれます。 イベントは、次のように Event コンストラクターを使用して作成できます。 var event = new Event('build'); // Listen for the event. elem.addEventListener('build', function (e) { /* ... */ }, false); // Dispatch the event. elem.dispatchEvent(event); 上記のコード例は EventTarget.dispatchEvent() メソッドを使用します。 このコンストラクターは、ほとんどの最新のブラウザーでサポートされています (Internet E
ECMAScriptの使い方
プロポーザルのステージの進み方 2ヶ月に1度行われるTC39のミーティングでプロポーザルのステージを更新 ミーティングの議事録は tc39/tc39-notesで公開 毎年のECMAScriptをリリースするタイミング(6月)で、Stage 4のプロポーザルをマージ ECMAScript 20XXとしてリリース なぜ仕様策定プロセスが変わったのか ES2015以前: すべての仕様の合意が取れてからリリース ES2016以降: 合意が取れた仕様からリリース 変更理由: ECMAScriptのリリースに長い歳月がかかり言語の進化が停滞した 歴史的失敗: ES4では多くの変更を入れることを試みたが、TC39内でも意見が分かれ最終的に合意できなかった これにより言語の発展が数年間停滞した[^1] [^1]: Programming Language Standardization: Pattern
配列の重複をはじく、もしくは重複を取り出す - Qiita
var a = [1,2,3,3,2,2,5]; // 重複を削除したリスト var b = a.filter(function (x, i, self) { return self.indexOf(x) === i; }); // 重複のみをリスト var c = a.filter(function (x, i, self) { return self.indexOf(x) !== self.lastIndexOf(x); }); // 重複を検出したものを重複しないでリスト var d = a.filter(function (x, i, self) { return self.indexOf(x) === i && i !== self.lastIndexOf(x); }); console.log(a); // [ 1, 2, 3, 3, 2, 2, 5 ] console.log
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
モジュール管理、だけじゃない-Webpack入門 〜 JSおくのほそ道 #029 - Qiita
実践ES Modules
JavaScript で Promiseを返す非同期/同期的に動作する複数の関数を並列に呼び出し、その結果を取得する - Qiita
PureScript使ってみた - Qiita
