はじめに この記事ではアロー関数とpromiseについての、使い方のまとめです。とくにpromiseに関しては、非同期処理の鉄板、async.jsとの比較をしながらその実装方法を見ていきます。 そのまえに、ECMAScript6の基本構文はこちら。 ECMAScript6の基本構文まとめ - JavaScript 技術情報のみつぶやくアカウント作成しました。ECMAScript6などの最新情報も追っていきます。 Twitter: @takeharumikami RSSはこちら Feedly: Feedlyをフォロー RSS: http://qiita.com/takeharu/feed

JavaScriptにおける、ECMAScript6についてのまとめの前編です。またこの記事では、実践で使える情報のみまとめています。網羅的にすべてをまとめている情報ではありません。 基本構文の続き、アロー関数やPromiseはこちらの記事で。 ECMAScript6のアロー関数とPromiseまとめ - JavaScript 技術情報のみつぶやくアカウント作成しました。ECMAScript6などの最新情報も追っていきます。 Twitter: @takeharumikami RSSはこちら Feedly: Feedlyをフォロー RSS: http://qiita.com/takeharu/feed letによるブロックスコープ JavaScriptの他言語との違いで、悩めるポイントとしてスコープの範囲があります。ECMAscript6から、let命令により関数スコープではなく、ブロックス

はじめに ここではJavaScriptの配列である、Arrayの基本的な使い方をまとめました。主な内容としては、要素の追加、結合、取得、削除となります。 JavaScriptの最新情報などの技術系のみをつぶやくTwitterをはじめました。 Twitter: @takeharumikami RSSはこちら RSS: http://qiita.com/takeharu/feed Feedly: フォロー

最初に、JavaScriptにはクラスはありません。 コンストラクタからインスタンスを生成します。 なんだかなぁ・・と言う人は、 とりあえず単語は置いておいてコードから理解してください。 コンストラクタの基本 function Dog(name, cry) { this.name = name; this.bark = function() { console.log(cry); }; } var dog = new Dog('きなこ', 'わんわん'); console.log(dog.name); // きなこ dog.bark(); // わんわん もし「new」を忘れたら、関数呼び出しになってしまって一大事です。 これがわからない方はこちらの記事へ。 「JavaScript」の「this」は「４種類」？？ newの挙動 もし「new」をつけた場合は何がおこっているのか。 実は暗黙の

【他キーワード】 第一級関数(高階関数が扱える) カリー化(部分適用) 型推論 気をつけるべきは三点 JavaScriptで関数型を考えるにあたっては、 抑えるべきポイントは下記三点となります。 すべての関数が値を返す 関数に副作用がない（参照透過） 関数を値として扱える 関数型として気をつけることはほかにもあるのですが、 入門として今回は扱いません。 すべての関数が値を返す 関数がすべての値を返すようにします。 // Good function hello() { return 'Hello' } console.log(hello()); // Hello // Bad function hello() { console.log('Hello'); } hello();// Hello これによりその返り値を利用し、さらに関数を組み立てていきます。 関数に副作用がない（参照透過） 簡

JavaScriptの「プロトタイプ入門」 JavaScriptはオブジェクト指向です。 クラスという概念はないため、 擬似的なクラスの表現を使ったパターンがあります。 ただ今回はそちらではなくプロトタイプベースの説明をします。 その前にコンストラクタについて知らない人はこちらへ。 JavaScriptのクラス？コンストラクタ？ プロトタイプって？ そもそもプロトタイプってなに？ 実は、、プロトタイプとは「オブジェクト」のことなんです。 そして感覚としては親だと思って大丈夫です。 親の能力は子にも受け継がれている。。的なニュアンスですね。 （まぁ意味合いはちがいますがw） prototypeプロパティ ここで新規に関数を生成してみましょう。 そうするとprototypeプロパティが自動で作成されます。 このように関数を生成した時点で、 proto.prototypeプロパティが自動で生成さ

はじめに スタイルガイド自体は各々のルールでかなりの数が存在しますが、 下記のおすすめ4選を押さえておけば問題ないと思います。 おすすめ４選 Google JavaScript Style Guide Googleによる、最も代表的なスタイルガイドです。 時間のない方は、これだけにでも目を通しておく事をおすすめします。 JavaScriptのBad Partsについても述べられています。 英語：https://google.github.io/styleguide/javascriptguide.xml 日本語：http://www38.atwiki.jp/aias-jsstyleguide2/pages/1.html Closure Linterを使用することで、チームでの統一がしやすくなります。 グーグル製JavaScript文法チェッカー jQuery JavaScript Styl

最近聞かれたので、 自分がよく使うVimの移動コマンドをまとめてみました。 プラグインいらずの素のVimですが、 プラグインなしで十分高速に移動できます。 特に一行一文字検索のfコマンドとか、 変更してきた箇所をもどれるg;コマンドとかが使えてくると本当に便利です。 あっ、この記事は主にファイル内の移動に限っています。 基本移動 初心者はまず、矢印キーを脱却して、h, j, k, lへ。 10jのように数字を先に打つと、一気に数字分移動できる コマンド 移動内容

JavaScriptで関数型プログラミングを強力に後押しするUnderscore.jsのおすすめメソッド12選（lodashもあるよ）JavaScriptNode.js関数型言語 はじめに この記事では、関数型プログラミングを強力に後押しするライブラリ、 Underscore.jsとlodashを紹介します。 両ライブラリとも_で使用できます。 ほかのライブラリにも依存せず、 現在フロントでもサーバでもかなり人気なライブラリです。 個人的にもこれなしでは。。 といった必須なライブラリとなっています。 また、Backbone.jsといった人気なフレームワークが、 Underscoreに依存していたりします。 Underscore.js GitHub: https://github.com/jashkenas/underscore Document: http://underscorejs.o

javascriptの「this」は「4種類」？？ この記事ではベースとなる４種類の「this」を紹介します。 実際は４種類ではないのですが、 このベースの４種類を理解できれば他もすぐに理解できます。 thisの４種類のパターン １：メソッド呼び出しパターン ２：関数呼び出しパターン ３：コンストラクタ呼び出しパターン ４：apply,call呼び出しパターン ここで重要なのは「呼び出し元」をみることです。 なぜなら「呼び出し元」に「this」は左右されるからです。 メソッド呼び出しパターン これはもう一番直感的にわかりやすいです。 説明はいらないんじゃないかという感じなのですが、 一応ソースを。。 //メソッド呼び出しパターン var myObject = { value: 10, show: function() { console.log(this.value); } } myObj