Bagaimana untuk mencipta fungsi tak segerak dalam TypeScript?

Pengaturcaraan tak segerak membolehkan kami melaksanakan pelbagai tugas secara selari. Kita boleh menjadikan fungsi tak segerak menggunakan kata kunci async/menunggu.

Sebelum bermula, mari kita fahami dahulu keperluan pengaturcaraan dan fungsi tak segerak. Apabila kami mendapat data daripada API, ia mengambil sedikit masa untuk bertindak balas. Sekarang, kami perlu menggunakan hasil yang diperoleh daripada API dalam aplikasi kami.

Bahasa pengaturcaraan berutas tunggal seperti TypeScript dan JavaScript tidak pernah menghentikan pelaksanaan kod. Jadi daripada menunggu jawapan daripada API, ia mula melaksanakan beberapa operasi pada nilai nol.

Apabila kami membuat fungsi tak segerak, ia menjeda pelaksanaan blok kod tertentu sehingga kami mendapat respons daripada API. Oleh itu, kita boleh memanipulasi data dan bukannya memanipulasi nilai nol.

Tatabahasa

Pengguna boleh menjadikan fungsi tak segerak dalam TypeScript dengan mengikut sintaks berikut.

async function func1() {
   await resolvePromise();
   // this code will not be executed until the promise is resolved
}

func1();
// this code will execute even if the promise is not resolved.

Dalam sintaks di atas, kami telah menggunakan kata kunci async sebelum fungsi untuk menjadikannya tak segerak. Selain itu, kami juga menggunakan kata kunci await untuk menjeda pelaksanaan fungsi sehingga kami mendapat respons janji.

Jadi, kata kunci tunggu hanya menjeda pelaksanaan fungsi tak segerak dan kod lain boleh terus dilaksanakan. Sebaik sahaja komitmen diselesaikan, ia mula dilaksanakan semula.

Sekarang, mari kita fahami konsep fungsi tak segerak melalui contoh yang berbeza.

Contoh

Dalam contoh ini, kami telah mencipta fungsi ujian tak segerak menggunakan kata kunci asinkron. Dalam fungsi test(), kami menggunakan kata kunci await untuk menjeda fungsi untuk satu tempoh masa.

Dalam output, pengguna boleh melihat bahawa ia mencetak "Selepas pelaksanaan fungsi" sebelum mencetak nilai pembolehubah data dalam fungsi. Jadi, kita boleh faham daripada ini bahawa apabila kata kunci await menjeda pelaksanaan fungsi, ia mula melaksanakan kod lain, dengan itu meningkatkan prestasi aplikasi.

async function test(): Promise {
   let data: string = await "default string";
   console.log("The value of data is " + data);
}

console.log("Before function execution");
test();
console.log("After function execution");

Apabila disusun, ia akan menjana kod JavaScript berikut -

"use strict";
async function test() {
   let data = await "default string";
   console.log("The value of data is " + data);
}
console.log("Before function execution");
test();
console.log("After function execution");

Output

Kod di atas akan menghasilkan output berikut -

Before function execution
After function execution
The value of data is default string

Contoh 2

Dalam contoh ini, fungsi samplePromise() mengandungi janji. Kami menggunakan pembina Promise untuk mencipta dan menyelesaikan Promises. Selain itu, kami mengembalikan janji daripada fungsi samplePromise().

Fungsi

executeAsync() menggunakan kata kunci await untuk memanggil fungsi samplePromise(). Pengguna boleh melihat dalam output bahawa kata kunci await menjeda pelaksanaan fungsi executeAsync() sehingga janji dipenuhi.

async function samplePromise() {
   const new_promise = new Promise(function (resolve, reject) {
      resolve("Successfully resolved");
   });
   return new_promise;
}

async function executeAsync() {
   try {
      let response = await samplePromise();
      console.log(response);
   } catch (err) {
      console.log("Error is " + err);
   }
}
console.log("Before calling a function");
executeAsync();
console.log("After calling a function");

Apabila disusun, ia akan menghasilkan kod JavaScript yang sama -

async function samplePromise() {
   const new_promise = new Promise(function (resolve, reject) {
      resolve("Successfully resolved");
   });
   return new_promise;
}

async function executeAsync() {
   try {
      let response = await samplePromise();
      console.log(response);
   } catch (err) {
      console.log("Error is " + err);
   }
}
console.log("Before calling a function");
executeAsync();
console.log("After calling a function");

Output

Ia akan menghasilkan output berikut –

Before calling a function
After calling a function
Successfully resolved

Dalam tutorial ini, pengguna mempelajari cara mencipta fungsi tak segerak. Selain itu, kami belajar menggunakan kata kunci async/menunggu dan komited untuk mendapatkan data daripadanya. Fungsi tak segerak meningkatkan prestasi aplikasi berbenang tunggal.

Atas ialah kandungan terperinci Bagaimana untuk mencipta fungsi tak segerak dalam TypeScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!