1.JavaScript にはどのようなデータ型がありますか? 最も一般的な 2 つの組み込みオブジェクト データ型の例を挙げてください。
常用的数据类型:Number,String,Boolean,Null,Undefined,Object
常见内置对象:Array,Function
2. 次のコードの出力は何ですか?
let a = [];
a[10] = 10;
console.log(a.length);
console.log(a[0]);
a[200] = undefined;
console.log(a.length);
console.log(a['10']);
出力は次のとおりです。
console.log(a.length); //11
console.log(a[0]); //undefined
a[200] = undefined;
console.log(a.length); //201
console.log(a['10']); //10
3. 次のコードの出力は何ですか?
console.log(null==undefined);
console.log("1"==1);
console.log(0.3 == 0.1+0.2);
let obj1 = {
a:1}; let obj2 = {
a:1};
console.log(obj1==obj2);
let obj3 = obj1; obj3.a=100;
console.log(obj1==obj3);
出力は次のとおりです。
console.log(null==undefined); //true
console.log("1"==1); //true
console.log(0.3 == 0.1+0.2); //false //这是因为浮点数在计算机中以二进制表示，而一些语言对十进制小数无法精确地表示为有限的二进制小数。0.1 和 0.2 都是十进制小数，但在计算机中以二进制表示时会有一些近似值，但不是完全相等的。 //0.3==0.3 是对的
console.log(obj1==obj2); //false 引用地址不等
console.log(obj1==obj3); //true 引用地址相等
4. document.addEventListener と document.removeEventListener はどのような状況でクリアされ、無効になりますか?
答え：
//错误实例
document.addEventListener('click', boundHandleClick.bind(this)); //错误
// 在某个时刻尝试移除事件监听器
document.removeEventListener('click', boundHandleClick.bind(this)); //错误
/*
*当我们尝试使用 removeEventListener 移除事件监听器时，由于绑定后的函数与原始函数不同，它们无
法匹配，因此无法正确移除监听器。因此，绑定 this 后的函数无法通过绑定后的函数来移除事件监听器。
*/
//正确案例
function handleClick(event) {
console.log('点击事件处理程序', this);
}
const boundHandleClick = handleClick.bind({
name: 'Example' });
document.addEventListener('click', boundHandleClick);
// 在某个时刻尝试移除事件监听器
document.removeEventListener('click', boundHandleClick);
5.js、数値型配列を指定するとArray<number>、最大値または最小値を返すいくつかの方法
第1种、使用 Math.max() 和 Math.min() 函数：
let arr = [1, 2, 3, 4, 5];
let max = Math.max(...arr);
let min = Math.min(...arr);
第2种、使用 reduce() 函数：
let arr = [1, 2, 3, 4, 5];
let max = arr.reduce((max, val) => Math.max(max, val), -Infinity);
let min = arr.reduce((min, val) => Math.min(min, val), Infinity);
第3种、使用 for 循环：
let arr = [1, 2, 3, 4, 5];
let max = -Infinity;
let min = Infinity;
for(let i = 0; i < arr.length; i++) {
if(arr[i] > max) {
max = arr[i];
}
if(arr[i] < min) {
min = arr[i];
}
}
6.js 文字列の繰り返し文字の削除。
(1). Set データ構造を使用します。
const str = "Hello World";
const uniqueStr = [...new Set(str)].join("");
console.log(uniqueStr); // Output: "Helo Wrd"
このメソッドは、一意の値のみを保存する Set データ構造のプロパティを利用します。文字列を Set オブジェクトに変換した後、それを文字列に戻して、重複文字が削除された結果を取得します。
(2)、正規表現と replace メソッドを使用します。
const str = "Hello World";
const uniqueStr = str.replace(/(.)(?=.*\1)/g, "");
console.log(uniqueStr); // Output: "Helo Wrd"
この方法では、正規表現と肯定的な先読みを使用して重複文字を照合して削除します。正規表現は/(.)(?=.*\1)/g任意の文字に一致し、その文字の後に同じ文字が続く場合に一致します。
.: 任意の文字と一致します。(?=.*\1): 先を見て、現在位置の後に同じ文字が存在することを確認します。g: グローバル一致、一致する文字をすべて削除します。
7.js 文字列の特定の文字の削除
(1)、正規表現と replace メソッドを使用します。
const str = "Hello, World!";
const charToRemove = ",";
const removedStr = str.replace(new RegExp(charToRemove, "g"), "");
console.log(removedStr); // Output: "Hello World!"
この方法では、正規表現を使用して、削除する文字を照合して置換します。文字列内の一致する文字をすべて削除するには、削除する文字を引数としてRegExpコンストラクターに渡し、グローバル マッチングのフラグを指定します。"g"
(2)、分割および結合メソッドを使用します。
const str = "Hello, World!";
const charToRemove = ",";
const removedStr = str.split(charToRemove).join("");
console.log(removedStr); // Output: "Hello World!"
このメソッドは文字列splitとjoinメソッドを使用します。まず、splitメソッドを使用して削除する文字に応じて文字列を配列に分割し、次にjoinメソッドを使用して配列要素を新しい文字列にマージして、指定した文字を削除するという目的を達成します。
8. js 配列
(1) から重複した値を削除し、データ構造の設定を使用します。
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = [...new Set(array)];
console.log(uniqueArray); // Output: [1, 2, 3, 4, 5]
このメソッドは、一意の値のみを格納する Set データ構造のプロパティを利用します。配列を Set オブジェクトに変換した後、配列に戻すと、重複した値が削除されます。
(2)、フィルターメソッドとindexOfを使用します。
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = array.filter((value, index, self) => {
return self.indexOf(value) === index;
});
console.log(uniqueArray); // Output: [1, 2, 3, 4, 5]
(3). このメソッドは、配列内の固有の値をフィルタリングするメソッドfilterと組み合わせて使用します。indexOfコールバック関数では、現在の要素のインデックスが最初に出現した要素のインデックスと等しいかどうかを判断して、それが一意の値であるかどうかを判断します。
//使用 reduce 方法：
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = array.reduce((accumulator, currentValue) => {
if (!accumulator.includes(currentValue)) {
accumulator.push(currentValue);
}
return accumulator;
}, []);
console.log(uniqueArray); // Output: [1, 2, 3, 4, 5]
このメソッドは、reduceメソッドを使用して配列を反復処理し、現在の値が既に含まれているかどうかに基づいて、結果の配列に追加するかどうかを決定します。
9.js配列は特定の値を削除します
(1)、フィルターメソッドを使用します。
const array = [1, 2, 3, 4, 2, 5];
const valueToRemove = 2;
const filteredArray = array.filter((value) => value !== valueToRemove);
console.log(filteredArray); // Output: [1, 3, 4, 5]
このメソッドは、filter削除する特定の値と等しくない配列要素をフィルタリングするメソッドを使用して、新しい配列を作成します。
(2)、スプライス方法を使用します。
const array = [1, 2, 3, 4, 2, 5];
const valueToRemove = 2;
for (let i = array.length - 1; i >= 0; i--) {
if (array[i] === valueToRemove) {
array.splice(i, 1);
}
}
console.log(array); // Output: [1, 3, 4, 5]
このメソッドは、splice配列から特定の値に等しい要素を直接削除するメソッドを使用します。要素を後ろから前に走査して削除すると、インデックスの位置ずれの問題を回避できることに注意してください。
(3) Reduce メソッドを使用します。
const array = [1, 2, 3, 4, 2, 5];
const valueToRemove = 2;
const filteredArray = array.reduce((accumulator, currentValue) => {
if (currentValue !== valueToRemove) {
accumulator.push(currentValue);
}
return accumulator;
}, []);
console.log(filteredArray); // Output: [1, 3, 4, 5]
このメソッドは、reduceメソッドを使用して配列を反復処理し、現在の要素が削除する特定の値と等しいかどうかに基づいて、結果の配列に追加するかどうかを決定します。
10.これの指摘する問題は何ですか?
例: Bilibili ビデオでは、
Baidu Yibo には多くの機能があると説明しています。
11. 閉鎖と次のような使用シナリオの理解
: Bilibili ビデオ分析
12.js 配列の平坦化
function flattenArray(arr) {
let result = [];
arr.forEach(item => {
if (Array.isArray(item)) {
result = result.concat(flattenArray(item));
} else {
result.push(item);
}
});
return result;
}
// 示例输入
const nestedArray = [1, [2, [3, 4], 5], 6, [7, 8]];
// 调用扁平化函数
const flattenedArray = flattenArray(nestedArray);
// 输出结果
console.log(flattenedArray); //[1, 2, 3, 4, 5, 6, 7, 8]
13.コンストラクターnewのプロセス中に主にいくつのことが起こりますか?
(可以百度网上有详细说明)
1.创建一个空对象
2.将函数的显示原型赋值给空对象的隐式原型
3.将函数的this指向空对象
4.返回新对象
注意当构造函数返回不是对象时，返回的还是this
14. jsのapply、bind、callの類似点と相違点は何ですか?
apply、bind、call は関数の実行コンテキストを変更するために使用されるメソッドであり、これらにはいくつかの類似点と相違点があり、実装原則も異なります。
同じ点:
関数の実行コンテキストを変更します。apply、bind、および call はすべて、関数内の this ポインターを変更するために使用されます。つまり、関数の実行時にコンテキスト オブジェクトを指定します。
違い：
パラメータの受け渡し方法: apply と call は両方とも関数にパラメータを渡すことができますが、方法は異なります。apply はパラメータを含む配列または配列に似たオブジェクトを受け取りますが、call は 1 つずつ列挙されたパラメータを受け取ります。bind はいくつかのパラメータをバインドして新しい関数を返すことができ、後で新しい関数を呼び出して残りのパラメータを渡すことができます。
戻り値: apply メソッドと call メソッドは、呼び出されるとすぐに関数を実行し、関数の結果を返します。バインド メソッドは新しい関数を返しますが、元の関数はすぐには実行されません。
cocos 作成者の質問
1. 画面適応の原理は何ですか?
(1). デザイン解像度: アート デザイン試験では、開発およびデザインの基準を提供し、さまざまな携帯電話の解像度に適応するために、解像度サイズが必要です。
(2).適応戦略: 適応高さ/適応幅
たとえば、ゲームの横画面で高さを適応する場合、デザイン案の設計高さとビューポート高さの比率変換を行う必要があります。したがって、ゲーム画面では、表示効果は比例変換された表示効果となる。
携帯電話のモデルが異なると、携帯電話の高さと幅が異なるため、設計図の高さと幅の比率が必ずしも一致しない場合があります。レイアウトと位置の効果を実現するにはどうすればよいですか?
①ドックポイント: ゲームでは、ウィジェットコンポーネントスクリプトを使用して、上、下、左、右のポイントを移動または中央に配置できます; ② 境界
領域のサイズと幅を調整します;
③ レイアウトを使用してコンテンツのスケーリングまたはレイアウトを調整できます;
2. cocos Creator のライフサイクルと使用方法は何ですか?
(1) ライフサイクルの概要:
onLoad: ノードがロードされた直後に呼び出され、ノードとコンポーネントの一部の設定を初期化するために使用されます。
start: onLoad の実行後に呼び出され、すべてのノードとコンポーネントが初期化されるまで待機する必要がある操作を実行するために使用されます。
update: ゲームのロジックとステータスを更新するためにフレームごとに呼び出されます。
lateUpdate: 更新後に呼び出され、更新後に実行する必要があるいくつかの操作を実行するために使用されます。
onDestroy: クリーンアップ作業を実行するためにノードが破棄される前に呼び出されます。
ライフサイクルの使用方法:
Cocos Creator では、スクリプト コンポーネントで定義することで、これらのライフサイクル関数を使用できます。
onLoad()、start()、update() などの対応する関数をスクリプト コンポーネントに記述し、関数内に対応するロジックを実装します。
これらの関数は対応するタイミングで自動的に呼び出され、関数内で初期化設定やリソースのロード、ゲームロジックの更新などを行うことができます。
ノードにスクリプト コンポーネントをマウントし、そのライフサイクル機能を使用する必要がある場合は、エディター インターフェイスからノードを選択し、対応するコンポーネントを追加できます。
ライフサイクルに関する考慮事項:
ライフサイクル関数の実行順序は固定されており、これらの順序に基づいてゲーム オブジェクトと状態を正しく管理できます。
ゲームのパフォーマンスへの影響を避けるために、ライフサイクル関数で時間のかかる操作を実行することは避けてください。
onDestroy ライフサイクル関数でリソースの解放とクリーンアップ作業を実行し、メモリ リークとリソースの無駄を回避します。
3. cocos Creator のライフサイクルにおける onLoad と start の違いと機能は何ですか?
(1)、onLoad ライフサイクル関数:
機能: ノードがロードされた直後に呼び出され、ノードとコンポーネントの一部の設定を初期化するために使用されます。これは、初期化フェーズへのエントリ ポイントです。
いつ呼び出すか: onLoad 関数は、ノードとそのコンポーネントがインスタンス化されてシーンに追加されるときに呼び出されます。onLoad 関数が実行される前に、ノードとコンポーネントのプロパティには値が割り当てられていますが、現時点では、他の関連するノードやコンポーネントの onLoad 関数が実行されているという保証はありません。
使用シナリオ: onLoad では、初期化設定、参照の取得、イベント リスナーの登録などの操作を実行できます。この関数ではリソースのロードやネットワークリクエストなどの非同期操作も実行できますが、非同期操作の実行時間と順序に注意する必要があります。
(2)、ライフサイクル関数を開始します。
機能: onLoad が実行された後、start 関数が呼び出されます。これは、ノードとコンポーネントの初期化が完了した後のエントリ ポイントです。
呼び出し時: ノードとそのコンポーネントが初期化されるときに、start 関数が呼び出されます。start 関数が実行される前に、すべてのノードとコンポーネントの onLoad 関数が実行されています。
使用シナリオ: 開始では、アニメーションの再生、タイマーの起動、ゲーム ロジックの初期化など、実行する前にすべてのノードとコンポーネントが初期化されるまで待機する必要があるいくつかの操作を実行できます。
4. cocos Creator のライフサイクル ondisable および ondestroy の機能と使用法は何ですか?
これらは、ゲーム オブジェクトの無効化および破棄プロセスを管理するために使用されます。
(1)、onDisable ライフサイクル関数:
機能: ノードが無効になっているときに呼び出され、ノードが無効になっているときに実行する必要があるいくつかの操作を実行するために使用されます。
呼び出し時: onDisable 関数は、ノードが無効になったときに (シーンからノードを削除したり、ノードの親ノードを無効にしたりするなど) ときに呼び出されます。
使用シナリオ: onDisable では、一部のノード関連ロジックを一時停止したり、タイマーを停止したり、イベント リスナーやその他の操作をキャンセルしたりできます。
注: onDisable 関数は、ノードが最初に作成されたときは呼び出されず、ノードが以前にアクティブ化および無効化されたときにのみトリガーされます。
(2)、onDestroy ライフサイクル関数:
機能: ノードが破棄される前に呼び出され、クリーンアップ作業とリソース解放操作を実行するために使用されます。
呼び出し時: ノードが破棄されるとき (シーンからノードを削除するか、ノードの destroy メソッドを直接呼び出すなど)、onDestroy 関数が呼び出されます。
使用シナリオ: onDestroy では、ノードとコンポーネントのリソースを解放したり、イベント リスナーをキャンセルしたり、タイマーやその他の操作をクリーンアップしたりできます。
注: onDestroy 関数は、ノードが破棄されようとしているときに呼び出されます。この時点では、ノードとコンポーネントのプロパティとメソッドはまだ利用可能ですが、他の関連するノードとコンポーネントは破棄されている可能性があります。
ノードを無効にしても、onDestroy 関数はすぐにはトリガーされないことに注意してください。ノードが破棄される前にいくつかの操作を実行する必要がある場合は、onDisable で関連する処理を実行するか、ノードの destroy メソッドを外部から呼び出して onDestroy 関数をアクティブにトリガーできます。
5. cocos Creator ホット アップデートはどのように機能しますか?
Cocos Creator のホット アップデート機能を使用すると、ゲーム全体を再公開しなくても、ゲームの実行中にコードとリソースを更新できます。以下は、Cocos Creator ホット アップデートの基本原則です。
サーバー側のリソースストレージ:
ホット アップデート プロセス中、サーバーはゲームの更新されたリソース ファイルを保存する必要があり、通常、リソースのダウンロードと更新には HTTP またはその他のネットワーク プロトコルが使用されます。
バージョン管理:
ゲームでは、現在のゲーム バージョンを識別するためにバージョン番号を定義する必要があります。構成ファイルまたはサーバー API から返されたデータを使用して、最新のゲームのバージョン番号を取得できます。
リソース更新チェック:
ゲームが開始されると、サーバーにリクエストが送信され、新しいバージョンが更新可能かどうかを確認します。通常、ローカル ゲームのバージョン番号はサーバー上の最新のバージョン番号と比較されます。
更新されたリソースをダウンロードします。
新しいバージョンが更新できる場合、ゲームはサーバーから提供されるリソース リスト ファイル (通常は JSON ファイル) に基づいて、更新する必要があるリソースのリストを取得します。
ゲームはリソース リストに従ってリソース ファイルを 1 つずつローカル ストレージ デバイスにダウンロードします。Cocos Creator が提供するダウンローダーを使用するか、ダウンロード ロジックをカスタマイズすることができます。
リソース ファイルを更新します。
ダウンロードが完了すると、ゲームは古いローカル リソース ファイルを新しいリソース ファイルに置き換えます。こうすることで、ゲームはリソースを使用するときに最新のファイルをロードします。
コードの更新チェックと置換:
JavaScript コードを更新するには、eval 関数を使用するか、動的に
6. XML と JSON の違いは何ですか?
XML (Extensible Markup Language) と JSON (JavaScript Object Notation) は、一般的に使用される 2 つのデータ交換形式ですが、次のような違いがあります。
文法構造:
XML は、タグと属性の階層構造を使用して、コンテンツなどのデータを表現します。
JSON は、{ "key": "value" } などのキーと値のペアの構造を使用してデータを表します。
データ型のサポート:
XML はデータ型を直接サポートしておらず、すべてのデータは文字列の形式で表されます。アプリケーションのニーズに応じて解析して変換する必要があります。
JSON は、文字列、数値、ブール値、配列、オブジェクトなどを含むさまざまなデータ型をサポートします。
可読性:
XML は自己記述型であり、タグと属性に読みやすく理解しやすい名前を付けることができます。
JSON の構文はより簡潔で、複雑なデータ構造の読み取りと書き込みが容易になる場合があります。
ファイルサイズ：
XML ではより多くのタグと属性が使用されるため、XML ファイルは一般に JSON ファイルよりも大きくなります。
JSON ファイルは、簡潔なキーと値の構造を使用しているため、比較的小さいです。
解析とシリアル化:
XML の解析とシリアル化には、追加のライブラリまたはカスタム パーサーを使用する必要があります。
JSON の解析とシリアル化は JavaScript でネイティブにサポートされており、JSON.parse() および JSON.stringify() を使用して直接操作できます。
データ相互作用:
XML は、SOAP、RSS、送信や対話の構成ファイルなどの分野でよく使用されます。
JSON は、Web アプリケーション、特に JavaScript 言語との対話やデータ転送でより一般的に使用されます。
XML と JSON のどちらを使用するかは、特定のニーズとシナリオによって異なります。XML は複雑な構造と自己記述的な要件を持つデータにより適しており、JSON は軽量のデータ交換や JavaScript との対話により適しています。さらに、他のシステム、ツール、言語との互換性やデータ転送の効率などの要素も考慮する必要があります。
7. オブジェクト プールは CPU または GPU を消費しますか?
オブジェクト プールは、再利用可能なオブジェクト インスタンスを管理してパフォーマンスとリソースの使用率を向上させるために使用される設計パターンです。オブジェクト プールは通常、オブジェクトを頻繁に作成および破棄するのではなく、事前に作成されたオブジェクトのセットをメモリ内に保持し、必要に応じてプールからオブジェクトを取得することによって実装されます。
オブジェクト プール自体は、CPU (中央処理装置) や GPU (グラフィックス プロセッシング ユニット) の消費に直接関与しません。これは、リソースの再利用と管理に焦点を当てたソフトウェア設計パターンです。
ただし、特定のコンテキストでは、オブジェクト プールの使用が CPU または GPU の消費に一定の影響を与える可能性があります。たとえば、ゲーム開発では、オブジェクト プールを使用すると、オブジェクトの頻繁な作成と破棄が削減され、CPU オーバーヘッドが削減されます。これは、オブジェクトの作成と破棄にはメモリの割り当てや解放などの操作が含まれるため、オブジェクト プールによりこれらのオーバーヘッドが回避され、パフォーマンスが向上します。
一方、オブジェクト プールの使用は、特にグラフィックス レンダリングを伴うシナリオでは、GPU に一定の影響を与える可能性があります。オブジェクト プールは、再利用可能なレンダリング リソース (テクスチャ、モデルなど) を管理できるため、リソースのロードと解放のコストが削減され、GPU 効率が向上します。
一般に、オブジェクト プーリング自体は、CPU や GPU の消費に直接関与しないソフトウェア設計パターンです。ただし、リソースの再利用と管理を最適化することで、オブジェクト プールは特定のコンテキストでの CPU と GPU の消費にプラスの影響を与え、パフォーマンスとリソースの使用率を向上させることができます。