[解決済み] JavaScriptでstr_replaceを実行し、テキストを置き換えるには?
質問
私は
str_replace
またはそれに似た代替手段を用いて、JavaScriptでテキストを置き換えることができます。
var text = "this is some sample text that i want to replace";
var new_text = replace_in_javascript("want", "dont want", text);
document.write(new_text);
を与える必要があります。
this is some sample text that i dont want to replace
正規表現を使用する場合、内蔵の置換メソッドと比較してパフォーマンスはどうなるのでしょうか。 内蔵の置換メソッドと比較して、どのようなパフォーマンス効果があるのでしょうか。
どのように解決するのですか?
文字列置換に regex を使用すると、著しく遅くなります。
実証されているように
JSPerfで
で示したように、正規表現の作成にはさまざまなレベルの効率がありますが、いずれも単純な文字列置換よりも大幅に遅くなります。
正規表現が遅くなるのは
:
固定文字列マッチには、バックトラック、コンパイルステップ、範囲、文字クラス、その他正規表現エンジンの速度を低下させる多くの機能がありません。正規表現マッチを最適化する方法は確かにありますが、一般的なケースでは、文字列へのインデックス付けに勝ることはないと思います。
JS perf ページでの簡単なテスト実行について、その結果の一部を文書化しました。
<script>
// Setup
var startString = "xxxxxxxxxabcxxxxxxabcxx";
var endStringRegEx = undefined;
var endStringString = undefined;
var endStringRegExNewStr = undefined;
var endStringRegExNew = undefined;
var endStringStoredRegEx = undefined;
var re = new RegExp("abc", "g");
</script>
<script>
// Tests
endStringRegEx = startString.replace(/abc/g, "def") // Regex
endStringString = startString.replace("abc", "def", "g") // String
endStringRegExNewStr = startString.replace(new RegExp("abc", "g"), "def"); // New Regex String
endStringRegExNew = startString.replace(new RegExp(/abc/g), "def"); // New Regexp
endStringStoredRegEx = startString.replace(re, "def") // saved regex
</script>
Chrome 68の結果は以下の通りです。
String replace: 9,936,093 operations/sec
Saved regex: 5,725,506 operations/sec
Regex: 5,529,504 operations/sec
New Regex String: 3,571,180 operations/sec
New Regex: 3,224,919 operations/sec
この回答を完全なものにするために(コメントから拝借)、以下のことを述べておきます。
.replace
はマッチした文字の最初のインスタンスを置き換えるだけです。そのため、すべてのインスタンスを
//g
. 複数の文字を置き換える場合、パフォーマンスとコードのエレガントさのトレードオフは悪くなります。
name.replace(' ', '_').replace(' ', '_').replace(' ', '_');
またはもっと悪い
while (name.includes(' ')) { name = name.replace(' ', '_') }
関連
-
[解決済み】gulp anythingを実行するたびに、アサーションエラーが発生します。- タスク関数を指定する必要があります
-
[解決済み] 配列から特定の項目を削除するにはどうすればよいですか?
-
[解決済み] JavaScriptで文字列が部分文字列を含むかどうかを確認する方法は?
-
[解決済み] あるJavaScriptファイルを他のJavaScriptファイルにインクルードするにはどうすればよいですか?
-
[解決済み] JavaScriptでメールアドレスを検証するのに最適な方法は何ですか?
-
[解決済み] JavaScriptでタイムスタンプを取得する方法は?
-
[解決済み] JavaScriptで空文字列/未定義文字列/null文字列をチェックするにはどうすればよいですか?
-
[解決済み] JavaScriptで要素のクラスを変更するにはどうすればよいですか?
-
[解決済み] JavaScriptで文字列をbooleanに変換するにはどうしたらいいですか?
-
[解決済み】JavaScriptで文字列の出現箇所をすべて置換する方法
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Vue Element-uiは、アイコンを追加するためのツリーコントロールノードを詳細に実装しています。
-
JSアレイループと効率解析の比較
-
vue3.0プロジェクトのアーキテクチャを構築するための便利なツール
-
VUEグローバルフィルターの概念と留意点、基本的な使い方
-
[解決済み】最大呼び出しスタックサイズ超過エラー
-
[解決済み】Node Version Manager のインストール - nvm コマンドが見つかりません。
-
[解決済み】Node.js Error: Cannot find module express
-
HTML5 LocalStorage ローカルストレージとセッションストレージの使用法
-
モジュールのビルドに失敗しました。Error: ENOENT: no such file or directory, scandir 'D:\.... \node_modules
-
JavaScriptのgetElementById、getElementsByTagNam、getElementsByClassNameの違いと使い方