検索
ホームページウェブフロントエンドjsチュートリアルJavaScriptテストツールの対決:sinon.js vs testdouble.js

JavaScript Testing Tool Showdown: Sinon.js vs testdouble.js

JavaScript Testing Tool Showdown: Sinon.js vs testdouble.js

単体テストの実際のコードをテストする場合、多くの状況により、テストの書き込みが困難になります。関数が呼び出されているかどうかを確認する方法は? AJAXコールをテストする方法は?または、setTimeoutのコードを使用しますか?この時点では、を使用して、コードを交換して、テストが難しいテスト内でテストを容易にするために、コードを交換する必要があります。

最近、testdouble.jsという新しいライブラリが出現しています。 Sinon.jsにセットされた同様の機能がありますが、あちこちでいくつかの違いがあることを除いて。

この記事では、sinon.jsとtestdouble.jsがそれぞれの長所と短所を提供し、比較して比較します。 Sinon.jsはまだより良い選択ですか、それとも挑戦者は勝つことができますか?

注:スタンドインのテストに慣れていない場合は、最初に私のsinon.jsチュートリアルを読むことをお勧めします。これは、ここで説明する概念をよりよく理解するのに役立ちます。

キーポイント

  • 機能セットと用語:sinon.jsは、他のプログラミング言語に精通している人に馴染みのある人に馴染みのあるスパイ、スタブ、モックなど、従来のテストスタンドインセットを提供します。 JavaScript中心の語彙に関しては、伝統的なスパイが排除されます。
  • 使いやすい:testdouble.jsには、初心者が習得するのが簡単なよりシンプルなAPIがありますが、sinon.jsは、他の言語の同様のテストツールに精通しているユーザーがそれを好むかもしれないより詳細ではあるが複雑なインターフェイスを提供しますその他。
  • 入力の処理の関数:sinon.jsは、明示的に構成されていない限り、testdouble.jsによる正確なパラメーターマッチングの厳格な要件とは対照的に、正確な一致を必ずしも必要とすることなく、入力パラメーターを使用することなく、スタブとアサーションの柔軟性を高めることができます。
  • Promise and Callbacksのサポート:TestDouble.jsは、Promiseの組み込みサポートを統合し、Sinon.jsよりも最新のJavaScript開発により適している可能性があります達成されます。
  • モジュールの交換機能:TestDouble.jsは、モジュール全体の交換をサポートします。これは、テストモジュールの相互作用の分離に役立ちます。
  • クリーニングとメンテナンス:TestDouble.jsは、単一のリセット機能でクリーニングプロセスを簡素化し、他のテストに影響を与える可能性のあるテストスタンドインを残すリスクを減らしますが、Sinon.jsは管理するのが面倒な複数のクリーニング方法を提供します。 。
  • この記事で使用されている用語

議論されているものを簡単に理解するために、使用されている用語の簡単な概要を次に示します。これらはsinon.jsの定義であり、他の場所でわずかに異なる場合があります。

テストStand-inは、テスト中に使用される機能の代替品です。以下に説明する3つのタイプのいずれかを参照できます。
  • Spyは、目的関数の動作に影響を与えることなく効果をチェックできるようにするテストの代役です。
  • スタブは、目的関数の動作を戻り値などの他の何かに置き換えるテストの代役です。
  • シミュレーションは、スタブとは異なるアプローチです。シミュレーションには、組み込みの検証が含まれています。これは、個別のアサーションの代わりになります。
  • testdouble.jsの目標の1つは、この用語の間の混乱を減らすことであることに注意する必要があります。
の概要

sinonには、スパイ、スタブ、モックの3つの異なるテストの代役概念があります。アイデアは、それぞれが異なる使用シナリオを表すということです。これにより、ライブラリは他の言語の人々や、Xunitテストモードなどの同じ用語を使用して本を読んだ人たちにとってより馴染みのあるものになります。しかし、一方で、これらの3つの概念は、最初に使用したときにシノンをより困難にすることもできます。

これは、Sinonの使用法の基本的な例です:

// 以下是查看函数调用的参数的方法:
var spy = sinon.spy(Math, 'abs');

Math.abs(-10);

console.log(spy.firstCall.args); // 输出:[ -10 ]
spy.restore();

// 以下是控制函数执行方式的方法:
var stub = sinon.stub(document, 'createElement');
stub.returns('not an html element');

var x = document.createElement('div');

console.log(x); // 输出:'not an html element'
stub.restore();
対照的に、testdouble.jsはよりシンプルなAPIを選択します。スパイやスタブなどの概念を使用する代わりに、JavaScriptの開発者が

td.functionなど、よりよく慣れている言語を使用しています。これにより、TestDoubleは潜在的に開始が容易になり、特定のタスクに適しています。しかし、一方で、いくつかのより高度な用途は単に不可能かもしれません(これは時々意図的です)。 td.object td.replace以下は、testdouble.jsの使用方法:

です

TestDoubleはよりシンプルな言語を使用します。 「スタブ」の代わりに関数を「交換」します。情報を取得するには、テスト疑惑の「解釈」関数が必要です。それとは別に、これまでのところ、それはシノンに非常に似ています。
// 以下是查看函数调用的参数的方法:
var abs = td.replace(Math, 'abs');

Math.abs(-10);

var explanation = td.explain(abs);
console.log(explanation.calls[0].args); // 输出:[ -10 ]

// 以下是控制函数执行方式的方法:
var createElement = td.replace(document, 'createElement');
td.when(createElement(td.matchers.anything())).thenReturn('not an html element');

var x = document.createElement('div');
console.log(x); // 输出:'not an html element'

// testdouble 使用一次调用重置所有测试替身,无需单独清理
td.reset();

これは、「匿名」テストのスタンドイン:

の作成にも拡張されます

および
var x = sinon.stub();

sinonのスパイとスタブには、それらに関するより多くの情報を提供する属性があります。たとえば、Sinonはなどの属性を提供します。 testdoubleの場合、この情報は
var x = td.function();

から取得します。 stub.callCount stub.args最大の違いの1つは、スタブの設定方法と検証が行われる方法に関連しています。 Sinonを使用すると、スタブの後にコマンドをリンクし、アサーションを使用して結果を確認できます。 testdouble.jsは、関数をどのように呼びたいか、または関数呼び出しを「リハーサル」する方法を示してください。 td.explain

// 我们也可以为测试替身命名
var x = td.function('hello');

x('foo', 'bar');

td.explain(x);
console.log(x);
/* 输出:
{
  name: 'hello',
  callCount: 1,
  calls: [ { args: ['foo', 'bar'], context: undefined } ],
  description: 'This test double `hello` has 0 stubbings and 1 invocations.\n\nInvocations:\n  - called with `("foo", "bar")`.',
  isTestDouble: true
}
*/
および

var x = sinon.stub();
x.withArgs('hello', 'world').returns(true);

var y = sinon.stub();
sinon.assert.calledWith(y, 'foo', 'bar');
これにより、TestDoubleのAPIが理解しやすくなります。これは、いつでリンクできるかを知る必要がないためです。

一般的なテストタスクをより詳細に比較します
var x = td.function();
td.when(x('hello', 'world')).thenReturn(true);

var y = td.function();
td.verify(y('foo', 'bar'));

高レベルでは、両方のライブラリが非常に似ています。しかし、実際のプロジェクトで実行する必要がある可能性のある一般的なテストタスクについてはどうでしょうか?いくつかの違いがどこに現れ始めているか見てみましょう。

testdouble.js spy

最初に注意すべきことは、testdouble.jsには「スパイ」の概念がないことです。 sinon.jsを使用すると、関数呼び出しを置き換えて、関数のデフォルトの動作を維持しながら情報を取得することができますが、これはtestdouble.jsでは不可能です。関数をTestDoubleに置き換えると、常にデフォルトの動作が失われます。

しかし、これは必ずしも問題ではありません。スパイの最も一般的な使用法は、それらを使用してコールバックが呼ばれていることを確認することです。

および

td.function大したことではありませんが、2つのライブラリ間のこの違いに注意することは依然として重要です。そうしないと、TestDouble.jsでより具体的な方法でスパイを使用できると予想している場合は驚くかもしれません。

var spy = sinon.spy();

myAsyncFunction(spy);

sinon.assert.calledOnce(spy);
testdouble.jsには、より正確な入力が必要

が必要です

遭遇する2番目の違いは、TestDoubleが入力に厳しいことです。
var spy = td.function();

myAsyncFunction(spy);

td.verify(spy());

Sinonのスタブとアサーションにより、提供されたパラメーターを不正確にすることができます。これは、例で説明するのが最も簡単です:

および

// 以下是查看函数调用的参数的方法:
var spy = sinon.spy(Math, 'abs');

Math.abs(-10);

console.log(spy.firstCall.args); // 输出:[ -10 ]
spy.restore();

// 以下是控制函数执行方式的方法:
var stub = sinon.stub(document, 'createElement');
stub.returns('not an html element');

var x = document.createElement('div');

console.log(x); // 输出:'not an html element'
stub.restore();

デフォルトでは、Sinonは関数に提供される追加のパラメーターの数を気にしません。 sinon.assert.calledWithExactlyなどの関数を提供しますが、ドキュメントのデフォルト値として推奨されません。 stub.withArgsのような関数には、「正確に」バリアントもありません。

一方、

testdouble.jsには、デフォルトで指定された正確なパラメーターが必要です。これは設計によるものです。アイデアは、この機能にテストで指定されていない他のパラメーターが提供されている場合、これはエラーであり、テストに失敗する可能性があるということです。

任意のパラメーターはtestdouble.jsで指定できますが、これはデフォルト値ではありません。

// 以下是查看函数调用的参数的方法:
var abs = td.replace(Math, 'abs');

Math.abs(-10);

var explanation = td.explain(abs);
console.log(explanation.calls[0].args); // 输出:[ -10 ]

// 以下是控制函数执行方式的方法:
var createElement = td.replace(document, 'createElement');
td.when(createElement(td.matchers.anything())).thenReturn('not an html element');

var x = document.createElement('div');
console.log(x); // 输出:'not an html element'

// testdouble 使用一次调用重置所有测试替身,无需单独清理
td.reset();

を使用すると、動作はsinon.jsに似ています。 ignoreExtraArgs: true

testdouble.jsには、約束のサポートが組み込まれています

および
var x = sinon.stub();

var x = td.function();
Note の形での約束サポートが含まれています。 stub.resolves testdouble.jsのコールバックサポートはより強力ですstub.rejects

sinonとtestdoubleは両方とも、スタブ関数コールバックを簡単に作成する方法を提供します。ただし、それらがどのように機能するかにはいくつかの違いがあります。

sinonは

を使用して、パラメーターとして受信した最初の関数

をスタブコールにします。

stub.yields testDouble.jsはデフォルトでノードスタイルモードになります。ここでは、コールバックは最後の

パラメーターであると想定されます。通話のリハーサル時に指定する必要はありません:
// 我们也可以为测试替身命名
var x = td.function('hello');

x('foo', 'bar');

td.explain(x);
console.log(x);
/* 输出:
{
  name: 'hello',
  callCount: 1,
  calls: [ { args: ['foo', 'bar'], context: undefined } ],
  description: 'This test double `hello` has 0 stubbings and 1 invocations.\n\nInvocations:\n  - called with `("foo", "bar")`.',
  isTestDouble: true
}
*/

TestDoubleのコールバックサポートをより強力にするのは、複数のコールバックまたは異なるコールバックでシナリオの動作を簡単に定義できることです。

var x = sinon.stub();
x.withArgs('hello', 'world').returns(true);

var y = sinon.stub();
sinon.assert.calledWith(y, 'foo', 'bar');

を呼び出したいとします

callback1の関数にパラメーターとして渡すことに注意してください。これにより、TestDoubleに、コールバックとして使用するパラメーターが表示されます。

var x = td.function();
td.when(x('hello', 'world')).thenReturn(true);

var y = td.function();
td.verify(y('foo', 'bar'));
sinonを使用して、動作を変更することもできます:

td.callback td.whenこの場合、

の代わりに

を使用します。特に多くのパラメーターを備えた機能については、それを機能させるために、それを機能させるために呼び出しの特定のインデックスを提供する必要があります。

var spy = sinon.spy();

myAsyncFunction(spy);

sinon.assert.calledOnce(spy);
特定の値を持つ2つのコールバックを呼び出したい場合はどうなりますか?

callsArgWith yields sinonでは、これは単に不可能です。複数の呼び出しを

にリンクできますが、そのうちの1つだけを呼び出します。

testdouble.jsには、モジュールの交換が組み込まれています

関数を
var spy = td.function();

myAsyncFunction(spy);

td.verify(spy());
に置き換えることができることに加えて、TestDoubleを使用すると、モジュール全体を交換することもできます。

これは、交換する必要がある関数を直接エクスポートするモジュールがある場合に主に役立ちます。 callsArgWith

testdoubleに置き換えたい場合は、たとえば...

を使用できます。
// 以下是查看函数调用的参数的方法:
var spy = sinon.spy(Math, 'abs');

Math.abs(-10);

console.log(spy.firstCall.args); // 输出:[ -10 ]
spy.restore();

// 以下是控制函数执行方式的方法:
var stub = sinon.stub(document, 'createElement');
stub.returns('not an html element');

var x = document.createElement('div');

console.log(x); // 输出:'not an html element'
stub.restore();
// 以下是查看函数调用的参数的方法:
var abs = td.replace(Math, 'abs');

Math.abs(-10);

var explanation = td.explain(abs);
console.log(explanation.calls[0].args); // 输出:[ -10 ]

// 以下是控制函数执行方式的方法:
var createElement = td.replace(document, 'createElement');
td.when(createElement(td.matchers.anything())).thenReturn('not an html element');

var x = document.createElement('div');
console.log(x); // 输出:'not an html element'

// testdouble 使用一次调用重置所有测试替身,无需单独清理
td.reset();
モジュールの交換について注意する必要があるもう1つのことは、testdouble.jsがモジュール全体を自動的に交換することです。ここの例のような関数のエクスポートである場合、関数を置き換えます。複数の関数を含むオブジェクトの場合、それらすべてを置き換えます。コンストラクターとES6クラスもサポートされています。 ProxyquireとRewireの両方で、何とどのように交換するかを個別に指定する必要があります。

testdouble.js sinon

のヘルパー関数がありません

Sinonのエミュレーションタイマー、エミュレーションXMLHTTPREQUEST、またはエミュレーションサーバーを使用すると、TestDoubleには存在しないことに気付くでしょう。

エミュレーションタイマーはプラグインとして使用できますが、xmlhttprequestsとajax関数をさまざまな方法で処理する必要があります。

単純なソリューションは、使用しているAjax関数を置き換えることです

$.post testdouble.js

を使用してテストコンテンツをクリーンアップする方が簡単です

または:

または:

var x = td.function();

通常、Sandboxおよび

メソッドを使用することをお勧めします。そうしないと、誤ってスタブやスパイを残すことができます。これにより、他のテストで問題が発生する可能性があります。これにより、トレースが困難なカスケードの障害につながる可能性があります。
// 我们也可以为测试替身命名
var x = td.function('hello');

x('foo', 'bar');

td.explain(x);
console.log(x);
/* 输出:
{
  name: 'hello',
  callCount: 1,
  calls: [ { args: ['foo', 'bar'], context: undefined } ],
  description: 'This test double `hello` has 0 stubbings and 1 invocations.\n\nInvocations:\n  - called with `("foo", "bar")`.',
  isTestDouble: true
}
*/

testdouble.jsは、代役をクリーンアップしてテストする方法のみを提供します:

。推奨される方法は、 これにより、テスト後のテストのスタンドインとクリーンアップのセットアップが大幅に簡素化され、追跡が困難なエラーの可能性が低下します。 sinon.test 長所と短所

td.reset()これら2つのライブラリの機能を理解しました。どちらもかなり似た機能を提供しますが、互いに異なるデザインのアイデアを持っています。それを利点と短所に分解できますか? afterEach

最初にsinon.jsについて話しましょう。 TestDouble.jsよりも多くの追加機能を提供し、その一部の側面を構成しやすいです。これにより、より特別なテストシナリオでより高い柔軟性が得られます。 Sinon.jsは、他の言語に精通している人々の言語も使用しています。スパイ、スタブ、模擬などの概念は、さまざまなライブラリに存在し、テスト関連の本でも議論されています。
var x = td.function();
td.when(x('hello', 'world')).thenReturn(true);

var y = td.function();
td.verify(y('foo', 'bar'));

不利な点は、複雑さを高めることです。その柔軟性により、専門家はより多くのことを行うことができますが、特定のタスクはtestdouble.jsよりも複雑であることを意味します。また、新しい人が代役の概念をテストするためのより急な学習曲線があるかもしれません。実際、私と同じくらいそれに精通している人でさえ、

の違いのいくつかを詳細に説明するのに苦労するかもしれません!

testDouble.jsは、よりシンプルなインターフェイスを選択しました。そのコンテンツのほとんどはかなりシンプルで使いやすく、JavaScriptにより適していると感じていますが、Sinon.jsは他の言語向けに設計されているように感じることがあります。これといくつかのデザインの原則のおかげで、初心者が開始するのは簡単であり、経験豊富なテスターでさえ、多くのタスクが簡単に完了しやすくなります。たとえば、TestDoubleは同じAPIを使用して、テストスタンドインをセットアップし、結果を検証します。また、より単純な洗浄メカニズムのために、エラーが発生しやすい場合があります。

テスト疑いのある最大の問題は、その設計原則のいくつかによって引き起こされます。たとえば、スパイが完全に不足していると、スタブよりもスパイを使用することを好む人にとっては不可能になる可能性があります。これは主に意見の問題であり、問​​題をまったく見つけられないかもしれません。それに加えて、testdouble.jsは更新されたライブラリですが、Sinon.jsにいくつかの深刻な競争を提供しています。

関数による比較

以下は、関数による比較です:

功能 Sinon.js testdouble.js
间谍
存根
延迟存根结果
模拟 1
Promise 支持 是(在 2.0 中)
时间辅助函数 是(通过插件)
Ajax 辅助函数 否(改为替换函数)
模块替换
内置断言
匹配器
自定义匹配器
参数捕获器 2
代理测试替身
  1. testdouble.js 技術的に言えばsinon.jsにはそのようなシミュレーションはありません。ただし、シノンのシミュレーションは本質的にスタブと検証を含むオブジェクトであるため、td.replace(someObject)を使用して同様の効果を実現できます。
  2. は、stub.yieldstub.yieldsと混同しないでください)を使用することにより、パラメーターキャプチャラーと同様の効果を達成できます。

概要と結論

sinon.jsとtestdouble.jsはどちらもかなり類似した機能セットを提供します。この点で、どちらも明らかに優れていません。

2つの最大の違いはAPIです。 Sinon.jsはおそらくもう少し長く、物事を行う方法について多くのオプションを提供しています。これはその長所と短所かもしれません。 TestDouble.jsには、よりlear的なAPIがあり、学習と使用が容易になりますが、その任意の設計により、問題があると感じる人もいます。

では、どちらが私に適していますか?

testdoubleの設計原則に同意しますか?もしそうなら、それを使用しない理由はありません。私は多くのプロジェクトでsinon.jsを使用していましたが、sinon.jsで行った作業の少なくとも95%を実行しており、残りの5%が簡単な回避策で行われる場合があります。

sinon.jsの使用が難しい場合、またはより「javascriptスタイルの」testdouble.jsを探している場合は、同様にあなたのためのものかもしれません。私のような人でも、シノンを使用するために多くの時間を費やしている人でさえ、私はtestdouble.jsを試してみて、あなたがそれを好きかどうかを見ることを提案する傾向があります。

しかし、testdouble.jsのいくつかの側面は、sinon.jsまたは他の経験豊富なテスターの知識を持つ人に頭痛を引き起こす可能性があります。たとえば、スパイの完全な不足が決定的な要因である可能性があります。 Sinon.jsは、依然として専門家と最も柔軟性を望んでいる人にとっては良い選択です。

実際にテストスタンドインの使用方法について詳しく知りたい場合は、無料のsinon.jsガイドをご覧ください。 Sinon.jsを使用していますが、同じテクニックとベストプラクティスをTestDouble.jsに適用することもできます。

問題はありますか?コメント?あなたはすでにtestdouble.jsを使用していますか?この記事を読んだ後、試してみることを検討しますか?以下のコメントで教えてください。

この記事は、ジェームズ・ライト、ジョーン・イン、クリスチャン・ヨハンセン、ジャスティン・サールスによってレビューされました。 SitePointコンテンツを最高の状態にしてくれたすべてのSitePointピアレビューアに感謝します!

javascriptテストツールに関するよくある質問:sinon.js vs. testdouble.js

sinon.jsとtestdouble.jsの主な違いは何ですか?

sinon.jsとtestdouble.jsはどちらも一般的なJavaScriptテストライブラリですが、いくつかの重要な違いがあります。 Sinon.JSは、スパイ、スタブ、シミュレーションなどのリッチな機能セット、およびエミュレートタイマーとXHRのユーティリティで知られています。これは、あらゆるテストフレームワークと組み合わせて使用​​できる汎用性の高いツールです。一方、TestDouble.jsは、テストするシステムの部分に代わるスタンドインをテストするためのシンプルで直感的なAPIの提供に焦点を当てたミニマリストライブラリです。タイマーやXHRをエミュレートするためのユーティリティは含まれていませんが、使いやすく理解できるように設計されているため、よりlear的なテスト方法を好む人にとっては素晴らしい選択肢です。

sinon.jsとtestdouble.jsをインストールする方法は?

sinon.jsおよびtestdouble.jsは、npm(node.jsパッケージマネージャー)を介してインストールできます。 sinon.jsの場合、コマンドnpm install sinonを使用できます。 testdouble.jsの場合、コマンドはnpm install testdoubleです。インストール後、それぞれテストファイルに導入してconst sinon = require('sinon')const td = require('testdouble')を使用できます。

はい、Sinon.jsとtestDouble.jsは、同じプロジェクトで同時に使用できます。それらはすべて非常にシンプルであり、他のライブラリとうまく機能するように設計されています。ただし、機能が重複しているため、同時にそれらを使用すると混乱につながる可能性があることを忘れないでください。通常、特定のニーズと好みに基づいてそれらのいずれかを選択することをお勧めします。

Sinon.jsでは、

を使用してスパイを作成できます。この関数は、パラメーター、戻り値、例外など、作成されたすべての呼び出しを記録するSPYオブジェクトを返します。 testdouble.jsでは、

を使用してスパイを作成できます。この関数は、パラメーターを含むすべての呼び出しを記録するテストスタンドアロン関数を返します。

sinon.spy() Sinon.jsでは、td.function()を使用してスタブを作成できます。この関数は、スパイのように動作するスタブオブジェクトを返しますが、返品値の指定や例外のスローなど、その動作を定義することもできます。 testDouble.jsでは、

を使用してスタブを作成できます。この関数を使用すると、特定のパラメーターを使用してテストスタンバイを呼び出すときに動作を定義できます。

Sinon.jsでは、

sinon.stub()td.when()などのメソッドを使用して、スパイやスタブを検証できます。 TestDouble.jsでは、

を使用して、テストスタンバイが何らかの方法で呼び出されるかどうかを主張できます。

testdouble.jsの代わりにsinon.jsを使用することの利点は何ですか?

sinon.jsには、testdouble.jsと比較して、より包括的な機能セットがあります。タイマーとXHRをエミュレートするためのユーティリティが含まれています。これは、特定の種類のコードをテストするのに非常に役立ちます。また、より広く使用されており、より大きなコミュニティがあります。つまり、より多くのリソースとサポートが得られることを意味します。

sinon.jsの代わりにtestdouble.jsを使用することの利点は何ですか?

testdouble.jsは、sinon.jsよりもシンプルで直感的なAPIを持っています。使いやすく理解できるように設計されているため、より合理化されたテスト方法を好む人には最適です。また、テストのスタンドインを乱用することを困難にすることにより、優れたテストの実践を奨励しています。

はい、sinon.jsとtestdouble.jsはどちらも非常にきれいに設計されており、他のテストフレームワークとうまく連携しています。 JavaScript対応のテストフレームワークで使用できます。

sinon.jsとtestdouble.jsの詳細については、どのリソースがありますか?

はい、sinon.jsとtestdouble.jsには、公式ウェブサイトに多くのドキュメントがあります。また、これらのライブラリからの詳細なコンテンツをカバーする多くのチュートリアル、ブログ投稿、オンラインコースもあります。

以上がJavaScriptテストツールの対決:sinon.js vs testdouble.jsの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
JavaScriptの文字列文字を交換しますJavaScriptの文字列文字を交換しますMar 11, 2025 am 12:07 AM

JavaScript文字列置換法とFAQの詳細な説明 この記事では、javaScriptの文字列文字を置き換える2つの方法について説明します:内部JavaScriptコードとWebページの内部HTML。 JavaScriptコード内の文字列を交換します 最も直接的な方法は、置換()メソッドを使用することです。 str = str.replace( "find"、 "置換"); この方法は、最初の一致のみを置き換えます。すべての一致を置き換えるには、正規表現を使用して、グローバルフラグGを追加します。 str = str.replace(/fi

カスタムGoogle検索APIセットアップチュートリアルカスタムGoogle検索APIセットアップチュートリアルMar 04, 2025 am 01:06 AM

このチュートリアルでは、カスタムGoogle検索APIをブログまたはWebサイトに統合する方法を示し、標準のWordPressテーマ検索関数よりも洗練された検索エクスペリエンスを提供します。 驚くほど簡単です!検索をyに制限することができます

8見事なjQueryページレイアウトプラグイン8見事なjQueryページレイアウトプラグインMar 06, 2025 am 12:48 AM

楽なWebページレイアウトのためにjQueryを活用する:8本質的なプラグイン jQueryは、Webページのレイアウトを大幅に簡素化します。 この記事では、プロセスを合理化する8つの強力なjQueryプラグイン、特に手動のウェブサイトの作成に役立ちます

独自のAjax Webアプリケーションを構築します独自のAjax Webアプリケーションを構築しますMar 09, 2025 am 12:11 AM

それで、あなたはここで、Ajaxと呼ばれるこのことについてすべてを学ぶ準備ができています。しかし、それは正確には何ですか? Ajaxという用語は、動的でインタラクティブなWebコンテンツを作成するために使用されるテクノロジーのゆるいグループ化を指します。 Ajaxという用語は、もともとJesse Jによって造られました

' this' JavaScriptで?' this' JavaScriptで?Mar 04, 2025 am 01:15 AM

コアポイント これは通常、メソッドを「所有」するオブジェクトを指しますが、関数がどのように呼び出されるかに依存します。 現在のオブジェクトがない場合、これはグローバルオブジェクトを指します。 Webブラウザでは、ウィンドウで表されます。 関数を呼び出すと、これはグローバルオブジェクトを維持しますが、オブジェクトコンストラクターまたはそのメソッドを呼び出すとき、これはオブジェクトのインスタンスを指します。 call()、apply()、bind()などのメソッドを使用して、このコンテキストを変更できます。これらのメソッドは、与えられたこの値とパラメーターを使用して関数を呼び出します。 JavaScriptは優れたプログラミング言語です。数年前、この文はそうでした

ソースビューアーでjQueryの知識を向上させますソースビューアーでjQueryの知識を向上させますMar 05, 2025 am 12:54 AM

jQueryは素晴らしいJavaScriptフレームワークです。ただし、他のライブラリと同様に、何が起こっているのかを発見するためにフードの下に入る必要がある場合があります。おそらく、バグをトレースしているか、jQueryが特定のUIをどのように達成するかに興味があるからです

モバイル開発用のモバイルチートシート10個モバイル開発用のモバイルチートシート10個Mar 05, 2025 am 12:43 AM

この投稿は、Android、BlackBerry、およびiPhoneアプリ開発用の有用なチートシート、リファレンスガイド、クイックレシピ、コードスニペットをコンパイルします。 開発者がいないべきではありません! タッチジェスチャーリファレンスガイド(PDF) Desigの貴重なリソース

独自のJavaScriptライブラリを作成および公開するにはどうすればよいですか?独自のJavaScriptライブラリを作成および公開するにはどうすればよいですか?Mar 18, 2025 pm 03:12 PM

記事では、JavaScriptライブラリの作成、公開、および維持について説明し、計画、開発、テスト、ドキュメント、およびプロモーション戦略に焦点を当てています。

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

PhpStorm Mac バージョン

PhpStorm Mac バージョン

最新(2018.2.1)のプロフェッショナル向けPHP統合開発ツール

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

DVWA

DVWA

Damn Vulnerable Web App (DVWA) は、非常に脆弱な PHP/MySQL Web アプリケーションです。その主な目的は、セキュリティ専門家が法的環境でスキルとツールをテストするのに役立ち、Web 開発者が Web アプリケーションを保護するプロセスをより深く理解できるようにし、教師/生徒が教室環境で Web アプリケーションを教え/学習できるようにすることです。安全。 DVWA の目標は、シンプルでわかりやすいインターフェイスを通じて、さまざまな難易度で最も一般的な Web 脆弱性のいくつかを実践することです。このソフトウェアは、

mPDF

mPDF

mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。