Bagaimana untuk Melaksanakan Pengesanan Perlanggaran yang Cekap dalam JavaScript Tanpa Perpustakaan?

JavaScript: Pengesanan Perlanggaran Cekap Tanpa jQuery atau gameQuery

Mengesan perlanggaran adalah penting dalam permainan dan simulasi berasaskan JavaScript. Walaupun jQuery dan gameQuery menawarkan kaedah yang mudah untuk tugas ini, pembangun mungkin menghadapi situasi di mana perpustakaan ini bukan pilihan. Dalam kes sedemikian, penyelesaian tersuai diperlukan.

Satu pendekatan untuk pengesanan perlanggaran ialah mencipta tatasusunan kedudukan objek dan menguji setiap lokasi objek berbanding objek yang bergerak. Walau bagaimanapun, kaedah ini adalah mahal dari segi pengiraan dan tidak sesuai untuk aplikasi masa nyata.

Pendekatan yang lebih cekap ialah menggunakan fungsi yang mengira segi empat tepat sempadan setiap objek dan menyemak sama ada segi empat tepat ini bertindih. Berikut ialah rutin segi empat tepat terikat yang mudah:

<code class="javascript">function isCollide(a, b) {
    return !(
        ((a.y + a.height) < (b.y)) ||
        (a.y > (b.y + b.height)) ||
        ((a.x + a.width) < b.x) ||
        (a.x > (b.x + b.width))
    );
}</code>

Fungsi ini mengambil dua objek (a dan b) dengan sifat x, y, lebar dan ketinggian serta mengembalikan benar jika ia berlanggar; jika tidak, ia mengembalikan palsu.

Untuk menggunakan fungsi ini, hanya bandingkan segi empat tepat terikat objek bergerak dan setiap objek yang berpotensi berlanggar. Berikut ialah contoh:

<code class="javascript">// Get the current position of the ball
var ballX = ball.offsetLeft;
var ballY = ball.offsetTop;
var ballWidth = ball.offsetWidth;
var ballHeight = ball.offsetHeight;

// Create an array of someobject positions
var someobjectPositions = [];
for (var i = 0; i < someobjects.length; i++) {
    var someobject = someobjects[i];
    someobjectPositions.push({
        x: someobject.offsetLeft,
        y: someobject.offsetTop,
        width: someobject.offsetWidth,
        height: someobject.offsetHeight
    });
}

// Check for collisions
for (var c = 0; c < someobjectPositions.length; c++) {
    if (isCollide(ball, someobjectPositions[c])) {
        // Handle the collision
    }
}</code>

Dengan menggunakan rutin segi empat tepat terikat yang cekap ini, anda boleh melaksanakan pengesanan perlanggaran masa nyata dalam JavaScript tanpa menggunakan perpustakaan berat seperti jQuery atau gameQuery.

Atas ialah kandungan terperinci Bagaimana untuk Melaksanakan Pengesanan Perlanggaran yang Cekap dalam JavaScript Tanpa Perpustakaan?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!