Akademi JavaScript · Pelajaran

Mencipta Web Worker

Mulakan bebenang latar belakang untuk menjalankan kerja.

Pelajaran 1 daripada 413 langkah

Mencipta Web Worker ialah pelajaran Akademi JavaScript percuma di CoddyKit. Ini ialah pelajaran 1 daripada 4. Sebanyak 3 pelajaran dalam laluan pembelajaran ini boleh dibaca sepenuhnya secara percuma — selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan praktikal dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Akademi JavaScript, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Akademi JavaScript merangkumi sejumlah 4 pelajaran.

Mengapa Pekerja Web?

JavaScript berjalan pada satu utas utama. Pengiraan yang panjang menyekat segala-galanya: antara muka pengguna menjadi beku dan klik tidak lagi bertindak balas. Pekerja Web menjalankan skrip pada utas latar belakang supaya page kekal responsif.

Mencipta Worker

Cipta worker dengan menghantar URL skrip kepada pembina Worker. Pelayar memuatkan fail tersebut dan menjalankannya pada utas yang berasingan.

const worker = new Worker('worker.js');
// The code in worker.js now runs on its own thread.

Skrip Worker

Fail worker ialah JavaScript biasa tetapi berjalan dalam skop globalnya sendiri (tiada window dan tiada document). Ia hanya berkomunikasi melalui mesej.

// worker.js
console.log('worker started');
// This runs off the main thread.

Dua Global Berasingan

Page utama dan worker masing-masing mempunyai skop global serta memori sendiri. Kedua-duanya tidak boleh berkongsi pemboleh ubah secara langsung; sebaliknya, kedua-duanya bertukar salinan data melalui mesej.

Utas utama: window, DOM, antara muka pengguna
Utas worker: self, pengiraan, tiada DOM

Self dalam Worker

Di dalam worker, objek global ialah self (sebuah DedicatedWorkerGlobalScope). Anda melampirkan pengendali dan memanggil API padanya, walaupun self selalunya tersirat.

// worker.js
self.addEventListener('message', (e) => {
  console.log('worker got:', e.data);
});

Worker Modul

Anda boleh mencipta worker yang menggunakan modul ES import dengan menghantar pilihan type: 'module'. Ini membolehkan worker mengimport modul lain dengan kemas.

const worker = new Worker('worker.js', { type: 'module' });
// Inside worker.js you can now use import statements.

Mengimport Skrip (Klasik)

Dalam worker klasik bukan modul, gunakan importScripts untuk memuatkan skrip tambahan secara segerak ke dalam skop worker.

// Inside a classic worker:
importScripts('math-utils.js', 'helpers.js');
// Their globals are now available in the worker.

Menamatkan Worker

Hentikan worker daripada utas utama dengan worker.terminate(), atau dari dalam worker dengan self.close(). Ini membebaskan utas dan memorinya.

// From the main thread:
worker.terminate();

// From inside the worker:
// self.close();

Mengendalikan Ralat Worker

Dengarkan acara error pada worker untuk menangkap pengecualian tidak tertangkap yang dicetuskan di dalamnya. Acara itu membawa mesej, nama fail dan nombor baris.

worker.addEventListener('error', (e) => {
  console.log('worker error:', e.message, 'at line', e.lineno);
});

Keperluan Asal yang Sama

Skrip worker mesti disediakan daripada asal yang sama dengan page (atau melalui URL gumpalan). Anda tidak boleh memuatkan worker secara langsung daripada URL silang asal yang sewenang-wenangnya.

// Same-origin file path - works:
const w1 = new Worker('/js/worker.js');

// You can also build one from a Blob URL when needed.

Khusus berbanding Dikongsi

Worker ialah khusus: terikat pada page yang menciptanya. SharedWorker boleh dicapai oleh beberapa page daripada asal yang sama. Kursus ini memfokuskan worker khusus.

Semakan Pantas

Uji pemahaman anda tentang penciptaan Pekerja Web.

Jawab dalam pelajaran interaktif

Imbas Kembali

Anda telah mempelajari cara mencipta Pekerja Web:

new Worker('worker.js') mencipta utas latar belakang.
Worker mempunyai globalnya sendiri (self) dan tiada DOM.
Gunakan type: 'module' untuk import, atau importScripts dalam worker klasik.
terminate() / self.close() menghentikannya.
Worker mesti berasal daripada asal yang sama.

Seterusnya, pemesejan antara utas.

Percuma untuk bermula

Pelajari JavaScript dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus: 59
Pelajaran: 200

Mula belajar secara percuma Lihat kursus penuh

Soalan Lazim

Adakah pelajaran “Mencipta Web Worker” percuma?

Ya — sebanyak 3 pelajaran dalam laluan pembelajaran Akademi JavaScript, termasuk “Mencipta Web Worker”, boleh dibaca sepenuhnya secara percuma di web ini. Selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan interaktif dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Kursus Akademi JavaScript merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Mencipta Web Worker”?

Mulakan bebenang latar belakang untuk menjalankan kerja. Anda berlatih Akademi JavaScript menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan Akademi JavaScript?

Tiada pengalaman terdahulu diperlukan. Pembelajaran Akademi JavaScript di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 1 daripada 4.

Berapa lamakah pelajaran “Mencipta Web Worker” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran Akademi JavaScript ini?

Ya. Setiap pelajaran Akademi JavaScript menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

← Kembali ke Akademi JavaScript