[B! javascript][Javascript][reference] kathewのブックマーク

kathew id:kathew

javascriptとJavascriptとreferenceに関するkathewのブックマーク (264)

JavaScriptのビルトインオブジェクトを拡張する - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
kathew 2022/08/24
javascript

tips

reference
リンク
モダン JavaScript チートシート
Skip to the content. モダン JavaScript チートシート画像クレジット: Ahmad Awais ⚡️ イントロダクション動機このドキュメントはモダンなプロジェクトでよく見られる JavaScript のチートシートと最新のサンプルコードです。このガイドは読者に JavaScript をゼロから教えるものではありません。基礎知識は持っていて、モダンなコードベースに慣れる（例えば React を学ぶ）のに苦労している開発者を助けるためのものです。説明の中で JavaScript の諸概念が使われています。また、議論の余地のあるポイントについてときどき個人的な tips を載せますが、その際はあくまでも個人的なおすすめであることを述べるように気をつけます。メモ: ここで紹介されている概念のほとんどは JavaScript 言語のアップデート（ ES2
kathew 2021/10/11
JavaScript

cheatsheet

development

reference
リンク
.reduce() | JavaScript 日本語リファレンス | js STUDIO
reduce()メソッドは配列に対して関数を適用し、その処理によって配列の各値を(左から右に)一つの値にまとめます。文法 arr.reduce(callback,[initialValue]) 配列内の各値で実行される関数です。この関数は4つの引数を受け取ります。 previousValue この値は直前(1つ前の要素)のコールバック実行で返された値か、または提供されていればinitialValue(後述)になります。 currentValue 配列内で現在処理されている要素です。 index 配列内で現在処理されている要素のインデックスです。 array reduceが呼び出されている配列そのものです。引数説明説明 reduceは配列内の各要素に対して(欠落しているものを除き)順番に、コールバック関数を実行していきます。コールバック関数は初期値(または直前のコールバック呼び
kathew 2021/09/22
javascript

reference
リンク
オプショナルチェーン演算子 (?.) - JavaScript | MDN
const adventurer = { name: "Alice", cat: { name: "Dinah", }, }; const dogName = adventurer.dog?.name; console.log(dogName); // 予想される結果: undefined console.log(adventurer.someNonExistentMethod?.()); // 予想される結果: undefined
kathew 2021/05/12
javascript

reference
リンク
Number.isNaN() - JavaScript | MDN
引数 value NaN かどうか検査される値です。返値論理値で、与えられた値が数値で、かつ値が NaN である場合は true を返します。そうでなければ false です。解説 Number.isNaN() 関数は、NaN と等しいことをチェックする便利な方法を提供します。なお、NaN と等しいことは == 演算子でも === 演算子でも検査できません。JavaScript の他のすべての値との比較とは異なり、一方のオペランドが NaN であれば、もう一方のオペランドが NaN であっても false と評価します。 JavaScript の有効なすべての値の中で、x !== x は NaN だけが true になりますので、Number.isNaN(x) は x !== x の検査を置き換えることができますが、後者の方が可読性が低くなります。グローバルの isNaN() 関数
kathew 2021/04/16
JavaScript

reference
リンク
配列のすべての要素の値を合計した値を取得する
要素の値を合計する(reduceメソッド) Array オブジェクトの reduce メソッドを使うと、配列に含まれるすべての要素の値を合計し、その合計値を返します。書式は次の通りです。配列名.reduce( コールバック関数(合計値の保管用, 要素の値), 初期値 ) 配列名.filter( コールバック関数(合計値の保管用, 要素の値, 要素のインデックス), 初期値 ) 配列名.filter( コールバック関数(合計値の保管用, 要素の値, 要素のインデックス, 配列), 初期値 ) reduce メソッドは配列に含まれる要素を先頭から順に取り出しコールバック関数を呼び出します。コールバック関数は、合計値の保管用、現在取り出されている要素の値、要素のインデックス、そして配列そのものを引数にして呼び出されます。コールバック関数の中では合計値の保管用の値に現在の要素の値を加算したものを
kathew 2021/03/22
javascript

reference
リンク
[JavaScript] 配列(Array)の合計値, 平均値, 中央値をモダンに求める - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
kathew 2021/03/22
javascript

reference
リンク
Array.prototype.reduce() - JavaScript | MDN
const array = [1, 2, 3, 4]; // 0 + 1 + 2 + 3 + 4 const initialValue = 0; const sumWithInitial = array.reduce( (accumulator, currentValue) => accumulator + currentValue, initialValue, ); console.log(sumWithInitial); // 予想される結果: 10 引数 callbackFn 配列の各要素に対して実行される関数です。その返値は、次に callbackFn を呼び出す際の accumulator 引数の値になります。最後の呼び出しでは、返値は reduce() の返値となります。この関数は以下の引数で呼び出されます。 accumulator 前回の callbackFn の呼び出し結果
kathew 2021/03/22
javascript

reference
リンク
TechAcademy [テックアカデミー]
はじめての副業コース Web制作の副業に必要なスキルが学べる確実にお仕事をはじめられる5万円案件保証手厚いサポートで副業を最短でスタート
kathew 2021/03/11
javascript

reference
リンク
[JavaScript] 数字を3桁カンマ区切りにする、2つの方法 - YoheiM .NET
こんにちは、@yoheiMuneです。数値を3桁カンマ区切りにしたいという要件を、JavaScriptでどのように実現するのかについて、ブログに書きたいと思います。目次解決したいこと「数字は3桁カンマ区切りで表示したいんだよね〜」と言われた時に、サクッと対応できる方法をお伝えしたいと思います。方法1：toLocaleString()を利用実装方法もっとも簡単に対応するなら、toLocaleString()関数を使うと便利です。数値型の変数に利用できます。 var num = 12345; num.toLocaleString(); // "12,345" toLocaleString()はロケール（=言語、国、地域、などを表現する、例：ja）に合わせた数値表現を行うためのメソッドです。ロケールによって表示が異なりますが、日本語や英語の場合には3桁カンマ区切りとなります。ブラ
kathew 2021/03/11
javascript

tips

reference
リンク
Document: querySelector() メソッド - Web API | MDN
引数 selectors 文字列で、照合する 1 つ以上のセレクターを設定します。この文字列は有効な CSS セレクター文字列でなければなりません。そうでない場合は SyntaxError 例外が発生します。なお、HTML 仕様書では、属性値が有効な CSS 識別子であることを要求していません。class または id 属性の値が有効な CSS 識別子でない場合、セレクター内で使用する前に、その値に対して CSS.escape() を呼び出すか、文字のエスケープで説明されている手法のいずれかを使用する必要があります。例については、属性値のエスケープを参照してください。返値 Element オブジェクトで、文書内で指定された CSS セレクターに最初に一致する要素を示すオブジェクト、もしくは、一致する要素がない場合は null を返します。指定されたセレクターに一致するすべての要素のリ
kathew 2021/03/04
javascript

reference
リンク
globalThis - JavaScript | MDN
解説従来、グローバルスコープにアクセスするには、JavaScript 環境ごとに異なる構文を必要としていました。ウェブ上では window, self, frames を使うことができます。しかし Web Worker は self のみを利用することができます。Node.js はこれらのいずれも利用できず、代わりに global を使用する必要があります。 this キーワードは、厳格でないモードで実行されている関数の中で使用することもできますが、厳格モードで実行されているモジュールや関数の中では undefined になります。Function('return this')() を使用することもできますが、CSP などによって eval() を無効にしている環境では、この方法でも Function の使用が抑制されます。 globalThis プロパティは、環境を越えてグローバルな
kathew 2021/02/25
javascript

reference
リンク
String.prototype.repeat() - JavaScript | MDN
P�mપ Learn Learn web development Frontend developer course Getting started modules Core modules MDN Curriculum Check out the video course from Scrimba, our partner Learn HTML Structuring content with HTML module Learn CSS CSS styling basics module CSS layout module Learn JavaScript Dynamic scripting with JavaScript module
kathew 2021/01/27
JavaScript

reference
リンク
Document: cookie プロパティ - Web API | MDN
値文字列で、セミコロンで区切られたクッキーのリストです (つまり key=value のペア)。なお、それぞれのキーおよび値の周囲にはホワイトスペース（空白やタブ文字）をおくことができます。実際のところ、RFC 6265 ではそれぞれのセミコロンの後に空白 1 文字を入れることを必須としていますが、一部のユーザーエージェントはこれに従っていません。また、このプロパティに "key=value" という形式の文字列を代入することで、設定または更新するクッキーを指定することもできます。なお、この方法を使用して一度に設定・更新できるクッキーは、1 つだけです。次のことも考慮してください。オプションとして次に挙げる値を設定することができます。 key と value のペアの後にセミコロンで区切って設定することで、クッキーを設定・更新することができます。 ;domain=ドメイン (例えば
kathew 2021/01/20
javascript

reference

cookie
リンク
while - JavaScript | MDN
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月. Learn more See full compatibility Report feedback
kathew 2021/01/18
JavaScript

reference
リンク
javascriptでsleepを実現する方法(実際にはsetTimoutを利用) - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
kathew 2021/01/18
javascript

reference
リンク
JSのObjectをforEachで処理する方法 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
kathew 2021/01/18
JavaScript

reference
リンク
Object.entries() - JavaScript | MDN
引数 obj オブジェクト。返値指定されたオブジェクト自身が持つ、文字列キーで列挙可能なプロパティのキーと値の組の配列。キーと値の組はそれぞれ 2 つの要素を持つ配列で、最初の要素がプロパティキー（常に文字列）、 2 つ目がプロパティ値です。解説 Object.entries() は、object に直接得られる文字列キーで列挙可能なプロパティのキーと値の組に対応する配列の要素を返します。これは for...in ループで反復処理するのと同じですが、 for...in ループではプロトタイプチェーンのプロパティも列挙されます。 Object.entries() が返す配列の順序は、 for...in ループで指定されたものと同じです。プロパティのキーだけが必要な場合は、代わりに Object.keys() を使用します。プロパティの値だけが必要な場合は、代わりに Object.va
kathew 2021/01/18
javascript

reference
リンク
Object.assign() - JavaScript | MDN
引数 target コピー先オブジェクト — コピー元のプロパティを適用するもので、変更後に返されます。対象とするプリミティブ値が指定された場合、その値はオブジェクトに変換されます。 source1, …, sourceN コピー元オブジェクト (単数または複数) — 適用したいプロパティを含むオブジェクトです。返値コピー先オブジェクトです。例外 TypeError 次のいずれかの場合に発生します。 target 引数は null または undefined です。ターゲットオブジェクトのプロパティへの代入に失敗しました。例えば、ターゲットオブジェクトでプロパティが書き込み不可であるため、またはそのセッターがエラーを発生させたためです。解説コピー先オブジェクトのプロパティは、コピー元に同じキーのプロパティがあると上書きされます。より後のコピー元のプロパティが、より前のものを
kathew 2020/11/27
JavaScript

reference
リンク
Promise チェーン
前置き: コールバックの章で言及した問題に戻りましょう。私たちは順次実行される一連の非同期タスクを持っています。例えば、スクリプトの読み込みです。上手くコード化するにはどうすればよいでしょう？ Promise はそのためのいくつかの方法を提供します。この章では promise チェーンを説明します。次のようになります: new Promise(function(resolve, reject) { setTimeout(() => resolve(1), 1000); // (*) }).then(function(result) { // (**) alert(result); // 1 return result * 2; }).then(function(result) { // (***) alert(result); // 2 return result * 2; }).t
kathew 2020/11/19
javascript

reference
リンク
1 2 3 4 5 6 7 8 9 10 次のページ