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

ECMAScript(JavaScript / JS)とそのさまざまな方言/実装(ActionScriptを除く)でのプログラミングに関する質問。このタグが単独で使用されることはほとんどありませんが、ほとんどの場合、[node.js]、[jquery]、[json]、および[html]タグに関連付けられています。

3
Typescriptで実際の「if」のように動作するReact「If」コンポーネントを作成するにはどうすればよいですか?
シンプルにした <If />Reactを使用し関数コンポーネントを。 import React, { ReactElement } from "react"; interface Props { condition: boolean; comment?: any; } export function If(props: React.PropsWithChildren<Props>): ReactElement | null { if (props.condition) { return <>{props.children}</>; } return null; } 次のようなよりクリーンなコードを記述できます。 render() { ... <If condition={truthy}> presnet if truthy </If> ... ほとんどの場合、問題なく機能しますが、たとえば、指定された変数が定義されていないかどうかを確認してから、それをプロパティとして渡したい場合は、問題になります。例を挙げましょう: <Animal />次の小道具を持つコンポーネントが呼び出されたとしましょう: interface …

4
Promiseを使用してCSSプロパティを設定すると、thenブロックで実際に設定されないのはなぜですか?
次のスニペットを実行してから、ボックスをクリックしてください。 const box = document.querySelector('.box') box.addEventListener('click', e => { if (!box.style.transform) { box.style.transform = 'translateX(100px)' new Promise(resolve => { setTimeout(() => { box.style.transition = 'none' box.style.transform = '' resolve('Transition complete') }, 2000) }).then(() => { box.style.transition = '' }) } }) .box { width: 100px; height: 100px; border-radius: 5px; background-color: …

2
Bullでジョブが2回実行されないようにするにはどうすればよいですか?
私には2つの機能がscheduleScan()ありscan()ます。 scan()scheduleScan() 新しいスキャンをスケジュールする以外に何もすることがないときにを呼び出すので、scheduleScan()をスケジュールできscan()ます。しかし、問題があります。一部のジョブは2回実行されます。 常に1つのジョブのみが処理されていることを確認したいと思います。どうすればそれを達成できますか?私はそれがdone()(scan()に含まれていたが、現在は削除されている)と関係があると思いますが、解決策を見つけることができませんでした。 Bullバージョン:3.12.1 重要な後半の編集: scan()別の関数を呼び出すと、他の関数を呼び出す場合と呼び出さない場合がありますが、それらはすべて同期関数であるため、独自のジョブが完了したときにのみ関数を呼び出します。「ツリー」の最後でそれを呼び出します。最後の関数はscheduleScan()を呼び出しますが、2つのジョブを同時に実行することはできません。scan()ちなみに、すべての仕事はで始まります。scheduleScan(stock, period, milliseconds, 'called by file.js') export function update(job) { // does some calculations, then it may call scheduleScan() or // it may call another function, and that could be the one calling // scheduleScan() function. // For instance, a function like finalize() } …

2
ブラウザーがネイティブPromiseをサポートしていない場合、マイクロタスクをキューに入れる方法は?
即時のコールバックのタイミングに依存しないコード(マイクロタスクとマクロタスクのような)を書く方が良いですが、とりあえず脇に置いておきましょう。 setTimeoutマクロタスクをキューに入れます。マクロタスクは、少なくとも、すべてのマイクロタスク(およびそれらが生成するマイクロタスク)が完了するまで開始を待機します。次に例を示します。 console.log('Macrotask queued'); setTimeout(function() { console.log('Macrotask running'); }); Promise.resolve() .then(function() { console.log('Microtask running'); }); console.log('Microtask queued'); console.log('Last line of script'); コードスニペットを実行する結果を非表示スニペットを展開 行動.then解決の約束には、即時の行動は基本的に異なるsetTimeoutコールバック-約束は.thenしても、最初に実行されるsetTimeout最初のキューに入れられました。ただし、Promiseをサポートしているのは最新のブラウザのみです。どのようにすることができ、特別な場合にはマイクロタスクの機能が適切にpolyfilledことPromiseは存在しないのですか? .thenを使用してのマイクロsetTimeoutタスクを模倣しようとすると、マイクロタスクではなくマクロタスクがキューイングされるため、.thenマクロタスクがすでにキューに登録されている場合、不適切にポリフィルされたものが適切なタイミングで実行されません。 を使用した解決策がありますMutationObserverが、見た目が醜く、それMutationObserverが目的ではありません。また、MutationObserverIE10以前ではサポートされていません。Promiseをネイティブでサポートしていない環境でマイクロタスクをキューに入れたい場合、より良い代替手段はありますか? (私は実際にはIE10をサポートしようとしているわけではありません。これは、Promiseなしでマイクロタスクをキューに入れる方法についての理論的な演習です)

3
未処理のプロミス拒否のソースの検索:TypeError:プロミスの連鎖サイクルが検出されました
Node.jsでPromiseからの未処理の拒否の原因を見つけようとしています --async-stack-tracesオプションを使用してノードバージョン12にアップグレードして、次の方法でそれらをリッスンしてみました。 process.on("unhandledRejection",( reason, promise ) => { console.log(reason); console.log(promise); }); しかし、原因を見つけるのに役立つスタックトレースはまだ表示されません! UnhandledPromiseRejectionWarning: TypeError: Chaining cycle detected for promise #<Promise> at process._tickCallback (internal/process/next_tick.js:68:7) (node:89675) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was …

5
Codewarsソリューション-入れ子にされて互いに作用する関数[終了]
休業。この質問には詳細または明確さが必要です。現在、回答を受け付けていません。 この質問を改善してみませんか?詳細を追加し、この投稿を編集して問題を明確にしてください。 4ヶ月前に閉鎖。 私はコードウォーズのパズルの解決策を探していましたが、それが機能する理由がわかりません。Minus()はどのように機能しますか? function makeNum(num, func) { if (func === undefined) { return num; } else { return func(num); } } function three(func) { return makeNum(3, func); } function eight(func) { return makeNum(8, func); } function minus(right) { return function(left) { return left - right; }; } console.log(eight(minus(three()))); // …
11 javascript 

2
Chromeウェブストアにいる間、htmlボタンでタブを開けないのはなぜですか?
フロントエンドにさまざまなボタンを備えたページがあり、すべてのボタンはそれ自体で完全に機能しますが、Chrome Webストアで拡張機能を開くボタンをクリックし、その後別のボタンをクリックすると、ページが開きません。 これが私が話していることの例です。開いているタブを閉じずにボタンをクリックした場合、Chrome Webストアが開いた後にクリックしたボタンは効果がありません。なぜそれがあり、それを回避する方法を誰かが知っていますか? https://html-ichr7r.stackblitz.io 以下がそのコードです。 <button id="button1" onclick="window.open('https://www.facebook.com/','popup','width=700,height=300');"><strong>CONTINUAR</strong></button><br> <button id="button2" onclick="window.open('https://www.google.com/','popup','width=700,height=300');"><strong>CONTINUAR</strong></button> <button id="button3" onclick="window.open('https://chrome.google.com/webstore/detail/dark-mode/dmghijelimhndkbmpgbldicpogfkceaj?hl=de','popup','width=700,height=300');"><strong>CONTINUAR</strong></button><br> <button id="button4" onclick="window.open('https://www.9gag.com/','popup','width=700,height=300');"><strong>CONTINUAR</strong></button> どんな助けでもありがたいです! 編集:私はそれがFirefoxで動作することを理解しましたが、それでもなぜそれがChromeで動作しないのか分かりません。

2
React-Native-Firebase(v6)Firestoreからデータを取得できません:undefinedは関数ではありません( '…this._firestore.native.collectionGet ...の近くにあります)
私はこの問題に長い間行き詰っています。私は、react-native-firebaseを使用して、react-nativeアプリケーションにFirestoreを実装し始めました。私はドキュメント[ https://invertase.io/oss/react-native-firebase/v6/firestore/quick-start#reading-data]に従っているだけですが、機能しません。 これはAndroidにあります。iOSではまだテストしていません。 私はこのエラーを受け取り続けます: [TypeError: undefined is not a function (near '...this._firestore.native.collectionGet...')] 関連するコードは次のとおりです。 import React, {Component} from 'react'; import { firebase } from '@react-native-firebase/firestore'; export default App extends Component{ constructor(props) { super(props); this.getData= this.getData.bind(this) this.getData() this.state = {}; } async getData() { try { const querySnapshot = await firebase.firestore() .collection('Gyms') …

2
元帳でビットコインpsbtに署名する方法は?
私はここで見つけたものに従って、bitcoinjs-libからPsbtトランザクションに署名しようとしています: https://github.com/helperbit/helperbit-wallet/blob/master/app/components/dashboard.wallet/bitcoin.service/ledger.ts 元帳の圧縮されたpublicKeyとbitcoinjsLibの圧縮されたpublicKeyの両方が同じ値を返すことを確認しました。 bitcoinjs-lib ECPairで署名できましたが、元帳を使用して署名しようとすると、常に無効です。 誰かがどこで間違えたのか指摘してくれる? これらの変数は、以下のコードで既に言及されていますが、明確にするために: - mnemonics: abandon abandon abandon abandon abandon abandon abandon abandon abandon abandon abandon about - previousTx: 02000000000101869362410c61a69ab9390b2167d08219662196e869626e8b0350f1a8e4075efb0100000017160014ef3fdddccdb6b53e6dd1f5a97299a6ba2e1c11c3ffffffff0240420f000000000017a914f748afee815f78f97672be5a9840056d8ed77f4887df9de6050000000017a9142ff4aa6ffa987335c7bdba58ef4cbfecbe9e49938702473044022061a01bf0fbac4650a9b3d035b3d9282255a5c6040aa1d04fd9b6b52ed9f4d20a022064e8e2739ef532e6b2cb461321dd20f5a5d63cf34da3056c428475d42c9aff870121025fb5240daab4cee5fa097eef475f3f2e004f7be702c421b6607d8afea1affa9b00000000 - paths: ["0'/0/0"] - redeemScript: (non-multisig segwit) 00144328adace54072cd069abf108f97cf80420b212b これは、私が手にしている最小の再現可能なコードです。 /* tslint:disable */ // @ts-check require('regenerator-runtime'); const bip39 = require('bip39'); const { default: Transport } = require('@ledgerhq/hw-transport-node-hid'); …

2
スクロールとCSSスクロールスナップにキーボードイベントを同時に使用すると競合が発生する
、キーを押すとSpace Bar、デモページを水平にスクロールできます。マウスまたはトラックパッドでスナップスクロールすることもできます。Page Up / Page DownLeft Arrow / Right Arrow しかし、どちらか一方のみが機能します。 キーボードイベントとCSSスクロールスナップが共存できる方法はありますか?何が欠けていますか?1週間以上この問題に取り組んできたので、どんな助けでも本当にありがたいです。 CodePenのデモをご覧ください (関連するCSSコードのコメントを解除して、スクロールスナップ効果を有効にして、キーボードショートカットが機能しなくなったことを確認してください。) コードスニペットを表示 import animate from "https://cdn.jsdelivr.net/npm/animateplus@2/animateplus.js" const sections = Array.from(document.querySelectorAll("section")).sort( (s1, s2) => { return s1.getBoundingClientRect().left - s2.getBoundingClientRect().left } ) const getSectionInView = () => { const halfWidth = window.innerWidth / 2 const index = sections.findIndex( section …

3
最適化をオフにできるので、クロージャーからのスコープ内変数は「最適化されません」。
最近のブラウザーで行われたコード最適化の副産物として、デバッグ中に、「実際に」スコープ内にあるすべての変数を「見る」ことはできません。これはよく知られており、SOに関する前の質問で対処されています。この機能は、確かに本番環境では便利ですが、開発中に私を悩ませますが、遅くなります(それは明らかです)。 今私の質問は、この動作をオフにする方法はありますか?構成ファイルを編集できますか、それともブラウザプラグインがありますか、それともブラウザ実行可能ファイルの「開発者向けの特別なビルドバージョン」がありますか?新しいコードを書いているとき、すぐにコードをコンソールに入力するのが好きなので、これは本当に私を悩ませています。 更新/編集 これは、部分的な解決策です。Paul1365972の功績です。 次のような特別なオプションを使用して、コマンドラインからChromeブラウザを起動する必要があります。 Chromeを完全に閉じます コンソールからChromeを実行します"C:/Program Files (x86)/Google/Chrome/Application/chrome.exe" --js-flags="--allow-natives-syntax" 。これは、他のWindows OSと同様です。 開発者コンソールを開いて実行し"%GetHeapUsage()"ます。オプションを使用してChromeを適切に起動した場合、番号がコンソールに記録されます。それ以外の場合は、構文エラーが発生します。 このコマンドラインフラグを使用すると%、で始まるコマンドを使用して「V8エンジンと通信」できます。これは、プレーンJavaScriptの構文エラーです。この種の使用可能なV8コマンドのリストは、Paulの回答に記載されています。 あり%NeverOptimizeFunction()、私はちょうど呼び出すことと、それを使って行うことがあるだろうことのように見えたものですそのリスト、上。残念ながら、次のスクリーンショットに示すように、その関数は私が望んでいたことをしません。 (((Paulの回答からのもう1つのリンク(v8ネイティブノードモジュール)は、このコンテキストではここでは重要ではありません。コードがクラッシュしないように、「%」関数呼び出しを1行で囲むだけです。 v8ではないブラウザー))) (((これが機能したとき(この最適化がまだ発明/実装されていないとき)を覚えています。10年前、15年前、そのようなものです。Chromeの最新バージョンは何ですか(もしそして、あなたができる最後のFirefoxバージョンは何でしたか(もっと確かにここにあります)?それはあなたに賞金をもたらすことはありませんが、もしあなたがたまたま知っていてそれを回答として投稿した場合、あなたは賛成票を得るでしょう。 。))) ソリューション PETR SRNICEKに感謝 新しい質問 ペトルのソリューションは多くのことを助けますが、完璧ではありません。この質問は長くなりすぎているので、Petrのソリューションをどのように改善できるかについて新しい質問を投稿しました。(もちろん、ここでこの質問を編集することもできますが、私が何を意味するのかを知っていれば、それは「歴史的でない」と感じるでしょう。)

1
React Router SPAのスクロール復元を実装する方法
Reactの単一ページアプリケーションを作成していますが、スクロール復元がChrome(およびおそらく他のブラウザー)で期待どおりに動作していないようです。 react-router-dom githubリポジトリには、ブラウザーが単一ページアプリのスクロールをネイティブで処理し始めていることを示すページがあり、にhistory.scrollRestoration設定されている場合、動作は従来の非SPA Webページの動作と同様になります。auto。 私が必要とする動作はそのページに示されています: ナビゲーションを上にスクロールして、一番下までスクロールした新しい画面を開始しないようにします。 「戻る」および「進む」クリック(ただし、リンククリックは除く)でのウィンドウとオーバーフロー要素のスクロール位置の復元 しかし、タブやカルーセルを含むルートの動作も無効にする必要があります。 問題に関するChromeの仕様へのリンクは次のとおりです。 OS XのChromeバージョン78.0.3904.97(公式ビルド)(64ビット)で私が観察しているのは、私がhistory.scrollRestoration manual設定から期待しているように見えるものです。つまり、ページの下半分までスクロールしてリンクをクリックすると、次のページが前のページと同じポイントまでページの下半分までスクロールされます。 私はhistory.scrollRestorationさまざまな時点でを確認しましたが、それが開始して留まることauto、デフォルト、 ここでの重要なポイントの1つは、@ TrevorRobinsonの回答によるものです。「スクロール復元時のブラウザの自動試行... ...ほとんどの場合、単一ページのアプリでは機能しません...」OK ...の一貫したサポートが見つかりましたhistory.scrollRestorationが、どうやらブラウザは、実際にスクロールの復元を行っているのがおかしい。次に、ここで注意する必要がありますで。これ、今日の時間を節約できました。 次に、これを手動で行う方法を調べましたが、先の方法がわかりません。react-router-scrollは、React Router v4と互換性がないと述べていますが、この質問の時点で最新のv5については触れていません。では、v5にも互換性がないと思いますか? 私は前方の道のために、さらに見て、約このSOの答えは見つかったので、ルータのV4に反応してスクロール復元を処理する方法を ...万一、私はそれが前提となりますルータV5に反応して動作しますか?更新:v5では私には機能しないようです。私はいくつかの構成を試しました。また、React Router v4で完全に機能させることもできませんでした。新しいページの一番上までスクロールしていたので、少なくとも生きていることはわかっていましたが、履歴の復元は行われません。 また、react-router-scroll-memoryも機能しましたが、タブやカルーセルに必要なものなど、指定されたルートでのスクロールを無効にするオプションはありません。 私はoaf-react-routerの使用を検討しましたが、特定のルートのスクロール復元またはトップへのスクロールの無効化に関するドキュメントには何も記載されていません。編集:私の回答で概説されているように、実際にこれを処理します。 見落としていることはありますか?この機能を必要とするのは私だけではないため、この問題に対処するための標準は何ですか。エッジの効いた、実験的なことをしているようですが、通常のサイトと同じようにスクロールする必要があります。

1
Electron OpenGL for MacOs Catalina
私は電子アプリケーションを構築していますが、エラーが発生してレンダリングが非常に遅くなり、CPU使用率が高くなります [1] Unable to create basic Accelerated OpenGL renderer. [1] Unable to create basic Accelerated OpenGL renderer. [1] Core Image is now using the software OpenGL renderer. This will be slow. 私は見つけようとしますが、問題についての答えを見つけることができませんでした。誰でもこの問題について何か考えがありますか?


3
Yarnを使用してモノレポにパッケージをインストールしないようにする方法
LernaとYarnのワークスペースを使用してモノレポを構築しました。 すべてが正常に動作しますが、パッケージに新しい依存関係をインストールするたびに(彼をAと呼びましょう)、次のように使用します。 yarn add <package_name> ヤーンはそれを追加し、Aが依存しないinstallパッケージでさえ、monorepo内のすべてのパッケージのスクリプトをトリガーします。 とにかくこれを避けるには?理由もなく、インストールに少し時間がかかります。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.