Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

ECMAScript 6(2015年6月に公開され、今もなお比較的新しい JavaScript)の大目玉である イテレータ と ジェネレータ。なかなかに複雑で巨大な仕組みになっていてややこしいです。 そこで今回は ジェネレータ を、順を追って理解できるように解説したいと思います。 Qiita: JavaScript の イテレータ を極める! ←こちらから読むのがオススメです Qiita: JavaScript の ジェネレータ を極める!(この記事) また、実用的なサンプルを「3. 実用サンプル」に示しました。 初めにこちらを見て、何ができるのかを知ってから読み始めるのもオススメです。 (2017年3月現在、オープンなページでの使用はまだ避けたほうがいいかもしれませんが、実装は確実に進んでいます。ECMAScript 6 compatibility table) 1. ジェネレータ、ジェ
もう語り尽くされた感もあるのですが、async/awaitで複数のPromiseを待ち合わせる場合のやり方についてです。 Chrome 69のDevToolsのコンソールで動作確認を行いました。 3行で Promise.all() を使う方法があるよね awaitの配列を作る方法もあるみたいなんだ おもしろいね(小並感) Promise.all()をawaitする 筆者がよくやるのは、Promise.all()をawaitする方法です。 async function hoge() { const start = Date.now(); // 時間計測用 // sleep的なやつ const p11 = new Promise(resolve => setTimeout(resolve, 1000)); const p12 = new Promise(resolve => setTimeou
JavaScriptでcookieを削除するためには、cookieの有効期限を過去日付または残存期間に0を設定します。ただし、cookieに有効期限または残存期間が設定されていない場合には、cookieはブラウザの終了時に削除されます。
[...Array(5)].map((_, i) => i) //=> [ 0, 1, 2, 3, 4 ] spread operator...と、arrow function=>を使っているためES6以降で動作します。 解説 上のコードは3つのパートに分けられます。 パート1: Array(5) これは要素数が5つ(=スロットが5つあるだけ)の空っぽの配列を作る。undefinedが5つ入るわけでない。
「match」の戻り値について! matchメソッドの戻り値について少し補足します。 matchメソッドの引数で指定した文字列パターンが抽出されなかった場合、matchメソッドからはnullが返ります。そしてもし一致する文字列が存在した場合は、抽出された文字列を配列で返します。 この仕組を利用すれば、IF文などの条件式としても利用できます。以下は、文字列内に2桁以上4桁以下の数字が含まれているかを条件分岐したサンプルコードになります。 const mystr = '1234'; const result = mystr.match(/\d{2,4}/); console.log(result); if (result!=null){ console.log('正規表現パターンにマッチしました'); } else{ console.log('正規表現パターンにマッチしませんでした'); }
Array.forEachとは ECMA-262標準で追加されたメソッドで、for文を書かなくても、Arrayの要素すべてに対してcallbackの処理を行ってくれる便利なメソッドです。 たとえば、配列の中身をすべて表示するようなコードを組んでみましょう。 // テストデータ const TEST_DATA = ["a", "b", "c", "d", "e"]; // 従来の記法 for(let i = 0; i < TEST_DATA.length; i++){ console.log(TEST_DATA[i]); } // forEachを利用した記法 TEST_DATA.forEach(value => { console.log(value); }); 関数型言語っぽい非常にシンプルな記述が可能ですね。 forブロック内における、break、continue、returnと同じ動
目次 配列の基本的な使い方 配列を空にする方法 配列を空にできたのか確認する方法 実際に書いてみよう まとめ 配列の基本的な使い方 配列は[]またはArrayで定義します。 let array1 = ['apple', 'orange', 'grape']; // 以下も同じ意味になる let array1 = new Array('apple', 'orange', 'grape'); 配列の要素を指し示すにはインデックスを指定します。インデックスは0から始まります。例えば2つ目の要素を指し示すには以下のように記述します。 array1[1]; 配列について、詳しくは以下の記事も参考にしてください。 MDN – 配列 [PR] コーディングで副業する方法とは 配列を空にする方法 配列を空にするには長さを0にします。 array1.length = 0; また空の配列を代入する方法もありま
標準組み込みオブジェクトArrayコンストラクターArray() コンストラクター静的メソッドArray.from()Array.fromAsync()Array.isArray()Array.of()静的プロパティArray[Symbol.species]インスタンスメソッドArray.prototype.at()Array.prototype.concat()Array.prototype.copyWithin()Array.prototype.entries()Array.prototype.every()Array.prototype.fill()Array.prototype.filter()Array.prototype.find()Array.prototype.findIndex()Array.prototype.findLast()Array.prototype.find
標準組み込みオブジェクトStringコンストラクターString() コンストラクター静的メソッドString.fromCharCode()String.fromCodePoint()String.raw()インスタンスメソッドString.prototype.anchor() 非推奨; String.prototype.at()String.prototype.big() 非推奨; String.prototype.blink() 非推奨; String.prototype.bold() 非推奨; String.prototype.charAt()String.prototype.charCodeAt()String.prototype.codePointAt()String.prototype.concat()String.prototype.endsWith()String.prot
JavaScriptにおけるシャローコピー(shallow copy)とディープコピー(deep copy)について簡単にまとめました。 shallowは日本語で「浅い」という意味になります。 シャローコピー シャローコピーはざっくり言うと参照元のオブジェクトとコピー先のオブジェクトどちらも同じメモリを参照していることをいいます。 簡単な例 const obj = { name: "hoge", age: 24 } const obj2 = obj obj.name = "fuga"; console.log(obj2.name) // fuga console.log(obj.name) // fuga 同じメモリを参照しているのでobj2のnameを変更するobjのnameも変更されてしまいます。 ディープコピー ディープコピーとは、オブジェクトのみのコピーではなく、オブジェクトとメモ
Install bower install moment-timezone --save # bower npm install moment-timezone --save # npm yarn add moment-timezone # Yarn Format Dates in Any Timezone var jun = moment("2014-06-01T12:00:00Z"); var dec = moment("2014-12-01T12:00:00Z"); jun.tz('America/Los_Angeles').format('ha z'); // 5am PDT dec.tz('America/Los_Angeles').format('ha z'); // 4am PST jun.tz('America/New_York').format('ha z'); // 8
アジマッチ有限会社代表取締役社長。書籍化歓迎。対応業務:PHP(Laravel)、機械学習、Vue.js、LAMP・AWS、越境EC、CTO、エンジニア採用、CTO、経営者の不安解決コンサルティング。 JavaScriptでscrollTopプロパティを使って要素のスクロールされるピクセル数を取得、設定する方法について、テックアカデミーのメンター(現役エンジニア)が実際のコードを使用して初心者向けに解説します。 JavaScriptでscrollTopプロパティを使うと、スクロール量をピクセル単位で設定や取得できます。 実務でもscrollTopプロパティによって画面スクロール処理を行うので、ぜひ学習してみてください。 目次scrollTopプロパティとはscrollTopプロパティの使い方要素のスクロールされるピクセル数を取得する方法要素のスクロールされるピクセル数を設定する方法実際に書
標準組み込みオブジェクトDateコンストラクターDate() コンストラクター静的メソッドDate.now()Date.parse()Date.UTC()インスタンスメソッドDate.prototype.getDate()Date.prototype.getDay()Date.prototype.getFullYear()Date.prototype.getHours()Date.prototype.getMilliseconds()Date.prototype.getMinutes()Date.prototype.getMonth()Date.prototype.getSeconds()Date.prototype.getTime()Date.prototype.getTimezoneOffset()Date.prototype.getUTCDate()Date.prototype.ge
ゼロパディング(zero padding)とは、書式の桁数に満たない数値の場合に、足りない桁数だけ 0 を追加して桁数を合わせることです。 たとえば3桁で1を表す場合、足りない2桁をゼロで埋めて 001 と表記します。 JavaScriptでは、String.slice() を使って桁数を合わせます。 たとえば変数 num の値の書式を3桁にしたい場合、下記のようになります。 var num = 1; var ret = ( '000' + num ).slice( -3 ); console.log(ret); 出力結果 001 希望の桁数だけ '000' の0を増やし、その桁数を solice( -3 ) として指定します。 2桁にしたい場合は下記になります。 var ret = ( '00' + num ).slice( -2 ); 値が想定する桁数を超えたときは上記の桁が失われるの
修正とお詫び コメントにて、JSON.stringifyがObject順序を保証しない、というご指摘を頂きました。誤った情報を掲載してしまったことをお詫び申し上げます。 JSON.stringify()によると、 注: 配列以外のオブジェクトのプロパティでは、特定の順番で文字列化されることは保証されていません。文字列化された同じオブジェクトの中でプロパティの順番に依存しないようにしてください。 とのことでしたので、JSON.stringifyをObjectに適用する方法ではなく、es6より実装された`Object.entries`を利用し、配列に適用する方法に修正しております。 JavaScriptのObjectとは JavaScriptのObjectは、他の言語における、いわゆる「連想配列」です。 こうしたい const a = {"a":"a"}; const b = {"a":"a"
const array = [1,1,1,1,{a: 1}]; const array2 = array; // 代入 const array3 = [...array]; // spread演算子による展開代入 (Shallow Copy) const array4 = array.concat(); // concatによるShallow Copy const array5 = JSON.parse(JSON.stringify(array)); // Serialize/DeserializeによるDeep Copy array[0] = 2; array[4].a = 2; console.log(array); // [ 2, 1, 1, 1, { "a": 2 } ] console.log(array2); // [ 2, 1, 1, 1, { "a": 2 } ] cons
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く