JavaScriptが辿った変遷 - QiitaRegister as a new user and use Qiita more conveniently You get articles that match your needsYou can efficiently read back useful informationYou can use dark themeWhat you can do with signing up
ES async/awaitを全力で使ってみて発見したイディオム - Qiita
// 注意: 最初のバージョン、async function がundefinedを返すと思い込んでて、色々間違えてた 手元の趣味コード(諸事情により未公開)に向けて全力で適用してみた結果学びがあった。以下babel。 事前に確認 async/await は Promise と Generator の糖衣構文である await は Promiseのインスタンスの式を与えると(見た目上)停止する await するには async functionで囲う必要がある async function は必ず非同期で実行され undefinedPromise を返す 以下イディオム とりあえず実行したい (async () => { await new Promise(done => { setTimeout(1000, done); }) })(); 解説: async ブロック作ってからの即時実行
ES2017 async/await + Promise で解決できる事、とES2015(ES6) generators (yield) + Promise + npm aa (async-await) で解決できる事 - Qiita
ES2017 async/await と Promise を使うと非同期処理をすごく簡単に処理できる。 とても便利なのだが、それだけでは、どうも機能が足りない様に見える。 この記事は... TL;DR ES2017 async/await を使っても、まだいろいろと課題は残ってるよ。 ES2015 (ES6) generators と npm aa (async-await) だと、より良い解決策があるよ。って話。 以下の図の様な非同期処理フローを考えてみる。 横軸は時間だ。左から右へ時間が流れていくものと考えて欲しい。 縦線は複数の処理を同期させたい、という意味だ。 ES2017 async/await 版のコード例を見てみよう。 'use strict'; //require('babel-polyfill'); // おまじない //require('regenerator').ru
Rollupがちょうどいい感じ - Qiita
昨年の途中からちらほら耳にするものの、まだ「なにそれ美味しいの?」なRollupですが、馴染むと手放せなくなる感じ。どんなものか、使い方から、プラグインのつくりかたまで、概観してみたいと思います。 Rollupって何? 複数ファイルに書かれたJavaScriptを、モジュールなどを読み込みつつ、ひとつのバンドルにしてくれるツール。WebPackとかBrowserifyみたいなやつです。依存モジュールの解決や、AltJSのプリコンパイルしたり、など。大きな特徴として、次の点がよく挙げられます。 生成ファイルが小さい ES6(ES2015)ネイティブ ドキュメント類はまだ最低限という感じですが、WebPackかBrowserifyにさわったことがあれば、そんなに迷うことはないかも。ただ、トップページに行っても正直よくわからないので、今のところWikiが一番の情報源です。公式の情報で見るべきとこ
ES6 exporting/importing in index file
I am currently using ES6 in an React app via webpack/babel. I am using index files to gather all components of a module and export them. Unfortunately, that looks like this: import Comp1_ from './Comp1.jsx'; import Comp2_ from './Comp2.jsx'; import Comp3_ from './Comp3.jsx'; export const Comp1 = Comp1_; export const Comp2 = Comp2_; export const Comp3 = Comp3_; So I can nicely import it from other
React.jsのRefsをES2015で書いてみた - Qiita
初投稿です。 これから備忘録代わりにキータに記事書いて行こうと思います。 早速ですがReact.jsのrefsのサンプルをES2015で書き直しました。 React.jsのrefsについて とりあえずrefsについてはこのリンクを見て頂ければと思いますが http://js.studio-kingdom.com/react/guides/more_about_refs stateにデータを流してDOM操作してると、jQueryでいうところのremoveやappendは使わないにしてもサンプルのようにある動作をした後に直接DOMを操作したいということが稀にあります。 そんな時にrefs使うと良いよっていう話しです。 とりあえず、上記リンクのコードをES2015化して行きます。 var App = React.createClass({ getInitialState: function()
ES6+カジュアルトークでES7について発表してきた
ES6+カジュアルトーク - connpass ES6+カジュアルトーク に参加と発表してきました。 自分は明日には使えなくなるES7トークというES7の話をしてきました。 「runstant 始めるEcmaScript6 入門」 by @phi_jp EcmaScript 6 のサンプル集 | runstant runstant jsfiddle的なツール ハンズオン let 2進数を直接書ける Lexical grammar - JavaScript | MDN デフォルトパラメータ 引数にデフォルト値を設定出来る 分割代入 template strings バッククオートでヒアドキュメントを書ける class syntax 「Node.js v0.12で使えるようになるES6+αの機能」 by @yosuke_furukawa Node.js v0.12で使えるようになるES6+の機
JavaScripthon - Pythonで書いてES6のコードを生成
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました 今のところ、Webブラウザで適切に動作が保証されているプログラミング言語はJavaScriptしかありません。そのため、Webアプリケーションを開発する上でJavaScriptの習得は必須なのですが、なるべくなら書きたくないという方も多いです。 もしあなたがPythonプログラマーであれば使ってみたいのがJavaScripthonです。PythonコードからECMAScript2016（ES6）へ変換してくれるソフトウェアです。 JavaScripthonの使い方 コード例です。普通にPythonのコードに見えます。 # -*- coding: utf-8 -*- # :Project: metapensiero.pj # :Author: Andrew Schaaf <andre
ES2015 (ES6)についてのまとめ - Qiita
ECMAScriptとは ECMAScriptはJavaScriptの中核仕様を抜き出して標準化したもの 開発当初のJavascriptは、ブラウザによる独自の拡張が多く、互換性が低かったため、Ecma Internationalが中心となりECMAScriptが開発された ES2015 (ES6)とは 先日策定された、ECMASCriptの6th Editionのことであり、当初はES6と呼ばれているが、正式名称をECMASCript2015(ES2015と呼ばれる)とし、今後は年単位のリリースを予定しているとのこと [公式サイト]http://www.ecma-international.org/ecma-262/6.0/index.html ES2015で可能となる新たなシンタックス let・constキーワードによる変数宣言 class構文 関数の引数のデフォルトパラメータ（Def
React and ES6 - Part 3, Binding to methods of React class (ES7 included)
This is the third post of series in which we are going to explore the usage of React with ECMAScript6 and ECMAScript7. You could find links to all parts of series below: React and ES6 - Part 1, Introduction into ES6 and React React and ES6 - Part 2, React Classes and ES7 Property Initializers React and ES6 - Part 3, Binding to methods of React class (ES7 included) React and ES6 - Part 4, React Mix
webpack(v1)とbabelでES6コードをさくっと書く - getalog
最低限のコストで最近よく聞くいい感じのjsを書きたい時の構成をずらーっと書いてみる 準備するもの node/npm (最近はrbenvクローンのnodenvがいい感じ、操作は同じ) webpack babel .babelrc .babelrcを設置しとくとbabelのデフォルト設定がこいつの中身で書き換わる Reactを使わないなら、presetのreactはいらない export defaultされたパッケージをimportした時に.defaultで引くのを許せるなら、add-module-exportsはいらない(後述) Reactいる { "presets": [ "es2015", "stage-0", "react" ], "plugins": [ "add-module-exports" ] } いらない { "presets": [ "es2015", "stage-0"
ライブラリをES2015(ES6)で書いて公開する所から始めよう
この記事はECMAScript 2015の事始めとして、ライブラリをECMAScript 2015で書いて公開するというところから始めるのがいいのではという内容です。 ECMAScript 2015(ES2015)はES6とも呼ばれていてどちらも同じものを指しますが、この記事ではES2015に統一します。 ECMAScriptのバージョンについては次のページを参照してください。 ECMAScript · JavaScriptの入門書 #jsprimer 2018-12-27: 追記 textlint/textlint-rule-helperのmasterはTypeScriptの実装へ変換されています。 Babelの実装はhttps://github.com/textlint/textlint-rule-helper/tree/2.0.1から参照できます Babel から TypeScrip
webdesign-dackel.com - このウェブサイトは販売用です！ - webdesign dackel リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
BabelでES2015の自動コンパイル環境を作る（Browserify / gulp / Grunt / webpack）
今年2015年6月にJavaScriptの標準仕様であるECMAScript 2015（ES2015 / ES6）が正式にリリースされ、フロントエンド界隈ではかなり盛り上がってきています。先日のHTML5とか勉強会も『ECMAScript 2015 & 2016特集』というテーマで開催されていました。そうした盛り上がりの中で思うのは、「すでにBabelありきで話が進められている」ということです。Babelも最初のコミットからやっと1年経ったくらいです。まだまだ使い方についてわからない方もいると思うので、ここでまとめておこうと思います。特に使用頻度が高いファイル状態を監視し自動でコンパイルする環境構築方法となります。 はじめに（ES2015とは）今年2015年6月に、これまで長々と仕様の策定が進められてきたECMAScriptの6thエディションがECMAScript2015（ES2015）
WEB+DB PRESS Vol.87のECMAScript 6特集を読んだ(+TypeScript) - dackdive's blog
特集1の「今すぐ活かす！ 最新JavaScript 進化した仕様ECMAScript 6をまるごと解説」を読んでES6（またはES2015）について勉強している。 WEB+DB PRESS Vol.87 作者:佐藤 鉄平,小林 明大,石村 真吾,坂上 卓史,上原 誠,鳥居 英,佐藤 歩,泉水 翔吾,うさみ けんた,伊藤 直也,高橋 侑久,佐藤 太一,hayajo,橋本 翔,西尾 泰和,中島 聡,はまちや2技術評論社Amazon ES6 については既に web 上でたくさんの記事があったりスライドが上がってたりするが、 書籍として出版されているものは要点がコンパクトに分かりやすくまとまっており、これから学ぼうとする人にはこの特集記事が一番いい資料だと思う。 個人的には ES6 で導入される新しい文法が「今の（ES5 の文法での）JavaScript だとどう書くか」と対比されているため それ
ES6 チートシート | POSTD
日々の仕事の中で役に立つES2015（ES6）のティップス、コツ、ベストプラクティス、プログラムの見本をご紹介します。コントリビューション歓迎です！ 目次 var vs. let / const IIFEからブロックベースへ アロー関数 文字列 デストラクチャリング モジュール パラメータ クラス シンボル マップ WeakMaps Promises ジェネレータ Async/Await var vs. let / const var の他に、値を格納する let と const という識別子が新たに追加されました。 var とは異なって、 let と const はクロージャのスコープ内で最初に記述されることはありません。 var の使用例です。 var snack = 'Meow Mix'; function getFood(food) { if (food) { var snack
SCRIPTY#4 〜フロントエンド紳士・淑女のための勉強会〜 #scripty04
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog 先日、定期的に開催しているフロントエンド技術に関する勉強会、SCRIPTYをヤフーで開催しました。 http://scripty.connpass.com/event/22663/ 本勉強会で発表されたセッションのスライドを発表者のコメントとともに公開いたします！ 発表セッションまとめ 1.Single-page application Zero to One （React/Redux/ES6/Firebase） 発表者：山中 悠 バックエンド専門だったエンジニアが、最新のフロントエンド技術を使ってシングルページアプリケーション（SPA）を作るまでに四苦八苦した話と、実際に作ったサンプルアプリケーションを発表しました。 SPA開発
ECMAScript 2015のブラウザ対応状況と実践投入に向けて
この記事は「ECMAScript2015/ES6特集」の第2回目です。第1回ではECMAScriptの歴史やES2015の新機能について紹介しましたが、今回は各ブラウザの対応状況や、実戦投入に向けて踏まえておくべき知識を解説します。 ECMAScript 2015の対応状況 ECMAScript 2015（ECMAScript 6th edition）は、2015年の6月に無事策定されました。しかし、実際にES2015の機能を使っていくには、ブラウザなどに搭載されているJavaScriptエンジンが対応していなくてはなりません。 ブラウザの実装状況についてはECMAScript 6 compatibility tableが参考になります。Chrome 46・Firefox 42・Edgeは既に多くの機能を実装してあり、DevToolsなどでも試すことができます。WebKitも順調に実装が進
ECMAScript 2015(ES6)の概要と次世代JavaScriptの新たな機能
ECMAScript 2015(ES6)の概要と次世代JavaScriptの新たな機能 泉水翔吾 この記事は「ECMAScript2015/ES6特集」の第1回目です。この特集ではJavaScriptの次世代仕様であるECMAScript 2015（ECMAScript 6）を取り上げ、歴史や経緯から追加された機能や文法の詳細など複数回に渡って解説していきます。 ECMAScriptとJavaScript そもそもECMAScriptとはなんでしょうか？JavaScriptとは一体何が違うのでしょうか？ECMAScriptとJavaScriptの関係は、JavaScriptが生まれた1995年まで遡ります。 JavaScriptは1995年、当時Netscape CommunicationsにいたBrendan Eich氏がWebで実行できるスクリプト言語として開発しました。その後Inte
これからのJavaScriptを知ろう！ Effective ES6 #yapcasia #yapcasiaC
まとめ YAPC::Asia Tokyo 2015 #yapcasia 全セッション総まとめ 前夜祭から大盛り上がりの様子を完全まとめしていきます。実況ツイートはトラック毎のハッシュタグ付き推奨！ #yapcasia / 全体 #yapcasiaA / トラックA (国際会議場) #yapcasiaB / トラックB (701-702) #yapcasiaC / トラックC (703) #yapcasiaD / トラックD (605-606) #yapcasiaE / トラックE (607-608) #yapcasiaDinner / 懇親会 (レセプションホール) 16514 pv 94 39 users 57
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
