タグ付けされた質問 「javascript」

私は長い間JavaScriptを作成してきましたが、を使用する理由がありませんでしたnull。それundefinedは常に望ましいようで、プログラム的に同じ目的を果たします。のnull代わりに使用する実際的な理由は何undefinedですか？

103 javascript  null  undefined 

Reactアプリでlintを実行していますが、次のエラーが表示されます。 error JSX props should not use arrow functions react/jsx-no-bind そして、これは私が矢印関数を実行しているところです（内部onClick）： {this.state.photos.map(tile => ( <span key={tile.img}> <Checkbox defaultChecked={tile.checked} onCheck={() => this.selectPicture(tile)} style={{position: 'absolute', zIndex: 99, padding: 5, backgroundColor: 'rgba(255, 255, 255, 0.72)'}} /> <GridTile title={tile.title} subtitle={<span>by <b>{tile.author}</b></span>} actionIcon={<IconButton onClick={() => this.handleDelete(tile)}><Delete color="white"/></IconButton>} > <img onClick={() => this.handleOpen(tile.img)} src={tile.img} style={{cursor: 'pointer'}}/> …

103 javascript  reactjs  ecmascript-6  jsx  arrow-functions 

JSONでオブジェクトの配列を返すWebサービスを呼び出しています。これらのオブジェクトを取得して、divにHTMLを入力したいと思います。各オブジェクトにURLと名前が含まれているとしましょう。 オブジェクトごとに次のHTMLを生成したい場合： <div><img src="the url" />the name</div> このためのベストプラクティスはありますか？私はそれを行ういくつかの方法を見ることができます： 文字列を連結する 要素を作成する テンプレートプラグインを使用する サーバー上でhtmlを生成し、JSONを介して提供します。

103 javascript  html  ajax  dynamic  dhtml 

私document.querySelectorAll(...).map(...)はFirefox 3.6でさえも実行できないだけでなく、答えを見つけることができないというバグを抱えています。そのため、このブログからの質問をSOにクロスポストすると思いました。 http://blowery.org/2008/08/29/yay-for-queryselectorall-boo-for-staticnodelist/ アレイを取得できない技術的な理由を知っている人はいますか？または、なぜStaticNodeListは、あなたが使用できるようにアレイから継承していないmap、concatなど、？ （ところで、必要な機能が1つだけの場合は、次のようなことを行うことができNodeList.prototype.map = Array.prototype.map;ますが、この機能が（意図的に？）そもそもなぜブロックされているのですか？）

103 javascript  dom  css-selectors 

私はクロームが、それはそう、私は非表示にすることができないことを実現しました<option>で<select>。Firefoxはそうします。 <option>検索条件に一致するを非表示にする必要があります。Chromeウェブツールではdisplay: none;、JavaScriptによって正しく設定されていることがわかり<select>ますが、メニューをクリックすると表示されます。 <option>メニューをクリックしたときに、検索条件に一致するを表示しないようにするにはどうすればよいですか？ありがとう！

103 javascript  jquery  css  dom 

オーバーロードへの古典的な（非JavaScript）アプローチ： function myFunc(){ //code } function myFunc(overloaded){ //other code } Javascriptでは、同じ名前で複数の関数を定義できません。そのため、次のようなものが表示されます。 function myFunc(options){ if(options["overloaded"]){ //code } } オーバーロードを含むオブジェクトを渡す以外に、JavaScriptで関数をオーバーロードするためのより良い回避策はありますか？ オーバーロードを渡すと、可能なオーバーロードごとに条件ステートメントが必要になるため、関数がすぐに冗長になります。関数を使用して//codeこれらの条件付きステートメントの内部を実行すると、スコープでトリッキーな状況が発生する可能性があります。

103 javascript 

画像パスが実際の画像につながるかどうかを判断する方法はありますか。つまり、JavaScriptで画像の読み込みに失敗した場合にそれを検出します。 Webアプリの場合は、xmlファイルを解析して、画像パスのリストからHTML画像を動的に作成しています。一部の画像パスがサーバーに存在しなくなった可能性があるため、ロードに失敗した画像を検出し、そのHTML img要素を削除することで、正常に失敗したいと思います。 注：JQueryソリューションは使用できません（上司はJQueryを使用したくないので、はい、始めません）。画像が読み込まれたときにJQueryで検出する方法は知っていますが、失敗したかどうかはわかりません。 img要素を作成するコードですが、imgパスが画像の読み込みに失敗したかどうかをどのように検出できますか？ var imgObj = new Image(); // document.createElement("img"); imgObj.src = src;

103 javascript  image 

一部のWebサイトでは、コピーされたコンテンツにテキストを追加するTyntの JavaScriptサービスを使用しています。 これを使用してサイトからテキストをコピーして貼り付けると、テキストの下部にある元のコンテンツへのリンクが表示されます。 Tyntはまた、これが発生したときに追跡します。それはよくできたきちんとしたトリックです。 これを行うためのスクリプトは印象的です-クリップボードを操作しようとするのではなく（古いバージョンのIEだけがデフォルトで操作でき、常にオフにしておく必要があります）、実際の選択を操作します。 したがって、テキストのブロックを選択すると、追加のコンテンツが<div>選択に含まれる非表示として追加されます。貼り付けると、余分なスタイルは無視され、余分なリンクが表示されます。 これは実際には単純なテキストブロックでかなり簡単に実行できますが、さまざまなブラウザーの複雑なHTMLで可能なすべての選択を検討するときの悪夢です。 私はWebアプリケーションを開発しています-コピーされたコンテンツを誰にも追跡できないようにしたいので、リンクではなくコンテキストに何かを追加情報に含めたいです。この場合、Tyntのサービスは実際には適切ではありません。 同様の機能を提供するが内部アプリケーションデータを公開しないオープンソースのJavaScriptライブラリ（jQueryプラグインなど）を知っている人はいますか？

103 javascript  clipboard 

この質問は、クロスサイトリクエストフォージェリ攻撃のみに対する保護についてです。 具体的には：Originヘッダー（CORS）による保護は、CSRFトークンによる保護と同じくらい優れていますか？ 例： Aliceは、ブラウザーを使用して（Cookieを使用して） " https://example.com "にログインします。彼女は最新のブラウザを使用していると思います。 アリスが「https://evil.com」にアクセスし、evil.comのクライアント側コードが「https://example.com」への何らかの要求を実行します（従来のCSRFシナリオ）。 そう： Originヘッダー（サーバー側）をチェックせず、CSRFトークンもチェックしない場合、CSRFセキュリティホールがあります。 CSRFトークンをチェックすれば安全です（ただし、少々面倒です）。 Originヘッダーを確認する場合、evil.comのクライアント側コードからのリクエストは、CSRFトークンを使用する場合と同様にブロックする必要があります。ただし、evil.comのコードでOriginヘッダーを設定できる場合は除きます。 私は、W3C仕様がすべての最新のブラウザーで正しく実装されていると信頼できる場合（少なくとも、クロスオリジンリソースシェアリングのセキュリティを参照）、これはXHRでは不可能であることを知っています（できるでしょうか？） しかし、他の種類のリクエストについてはどうでしょう-例えばフォーム送信？script / img / ...タグをロードしますか？または、ページがリクエストを（合法的に）作成するために使用できる他の方法？それとも、いくつかの既知のJSハック？ 注：私は話していません ネイティブアプリケーション 操作されたブラウザ、 example.comのページのクロスサイトスクリプティングのバグ ...

103 javascript  security  cors  csrf 

条件付きレンダリングを持つビューコンポーネントがあるとします。 render(){ if (this.state.employed) { return ( <div> <MyInput ref="job-title" name="job-title" /> </div> ); } else { return ( <div> <MyInput ref="unemployment-reason" name="unemployment-reason" /> <MyInput ref="unemployment-duration" name="unemployment-duration" /> </div> ); } } MyInputは次のようになります。 class MyInput extends React.Component { ... render(){ return ( <div> <input name={this.props.name} ref="input" type="text" value={this.props.value || null} …

103 javascript  reactjs 

スタートページに行くようなページを作ってみます。10秒間非アクティブ（ユーザーがどこもクリックしていない）。残りはjQueryを使用していますが、テスト関数のset / clearは純粋なJavaScriptです。 私の欲求不満の中で、私はこの関数のようなものになり、ページ上の任意のクリックで呼び出すことができると思いました。タイマーは正常に起動しますが、クリックしてもリセットされません。最初の10秒以内に関数が5回呼び出されると、5つのアラートが表示されます... clearTimeoutなし... function endAndStartTimer() { window.clearTimeout(timer); var timer; //var millisecBeforeRedirect = 10000; timer = window.setTimeout(function(){alert('Hello!');},10000); } だれかがトリックを実行するいくつかのコード行を取得しましたか？-任意のクリック停止で、タイマーをリセットして開始します。-タイマーがヒットしたとき。10秒で何かします。

103 javascript  jquery  timer  settimeout 

Webpackのローダーとプラグインの違いは何ですか？ プラグインのドキュメントはただ言う： プラグインを使用して、通常Webpackのバンドルに関連する機能を追加します。 babelがjsx / es2015変換にローダーを使用することは知っていますが、他の一般的なタスク（たとえば、copy-webpack-plugin）が代わりにプラグインを使用しているようです。

103 javascript  reactjs  webpack 

だから今まで、私はnode.js次の方法でクラスとモジュールを作成しました： var fs = require('fs'); var animalModule = (function () { /** * Constructor initialize object * @constructor */ var Animal = function (name) { this.name = name; }; Animal.prototype.print = function () { console.log('Name is :'+ this.name); }; return { Animal: Animal } }()); module.exports = animalModule; ES6を使用すると、次のように「実際の」クラスを作成できます。 class …

103 javascript  node.js  ecmascript-6 

.catch入れ子になった約束でBEFOREとAFTERの違いを理解するのに苦労します。 代替1： test1Async(10).then((res) => { return test2Async(22) .then((res) => { return test3Async(100); }).catch((err) => { throw "ERROR AFTER THEN"; }); }).then((res) => { console.log(res); }).catch((err) => { console.log(err); }); 代替2： test1Async(10).then((res) => { return test2Async(22) .catch((err) => { throw "ERROR BEFORE THEN"; }) .then((res) => { return test3Async(100); }); }).then((res) …

103 javascript  node.js  promise  bluebird 

モックするライブラリはありますlocalStorageか？ 私は他のほとんどのJavaScript モックにSinon.JSを使用してきましたが、それが本当に素晴らしいことを発見しました。 私の最初のテストでは、localStorageがFirefox（悲しい顔）で割り当て可能であることを拒否しているため、おそらくこれを回避するための何らかのハックが必要になります。 今のところ（私の見るとおり）、私のオプションは次のとおりです。 すべてのコードが使用するラッピング関数を作成し、それらをモックします localStorageのある種の（複雑になる可能性がある）状態管理（テスト前のスナップショットlocalStorage、クリーンアップリストアスナップショット）を作成します。 ?????? あなたはこれらのアプローチについてどう思いますか、そしてあなたはこれについて取り組む他のより良い方法があると思いますか？どちらの方法でも、結果として得られる「ライブラリ」を配置して、最終的にはオープンソースの良さのためにgithubに作成します。

103 javascript  unit-testing  mocking  local-storage  sinon