javascript tutorial 5: call, apply, bind, promises, and more

PPTX 20 стр. 265,3 КБ Бесплатная загрузка

Предварительный просмотр (5 стр.)

Прокрутите вниз 👇
1 / 20
javascript tutorial 5: call, apply, bind, promises, and more 1. call, apply, and bind these three methods are used to explicitly set the value of this when calling a function. they allow you to control the context in which a function is executed. 1.1 call() the call() method calls a function with a given this value and arguments provided individually. syntax: function.call(thisarg, arg1, arg2, ...) example: const person = { name: 'alice', greet: function(greeting) { console.log(`${greeting}, my name is ${this.name}`); } }; const anotherperson = { name: 'bob' }; // using call to invoke greet with 'this' pointing to anotherperson person.greet.call(anotherperson, 'hello'); // output: hello, my name is bob 1.2 apply() the apply() method is similar to call(), but it takes arguments as an array. syntax: function.apply(thisarg, [argsarray]) example: const numbers = [5, 6, 2, 3, 7]; // using apply to find the maximum number in an array const max …
2 / 20
{ reject('operation failed!'); } }); 2.3 handling promises: you can handle promises using .then() for success and .catch() for errors. promise .then((message) => { console.log(message); // output: operation successful! }) .catch((error) => { console.error(error); // output: operation failed! }); 2.4 chaining promises: promises can be chained to execute multiple asynchronous operations in sequence. const fetchdata = () => { return new promise((resolve) => { settimeout(() => resolve('data fetched'), 1000); }); }; fetchdata() .then((data) => { console.log(data); // output: data fetched return 'processing data'; }) .then((message) => { console.log(message); // output: processing data }); 2.5 async/await: async/await is syntactic sugar over promises, making asynchronous code look more synchronous. const fetchdata = () => { return new promise((resolve) => { settimeout(() => resolve('data fetched'), 1000); }); }; const processdata = async () => { try { const data = await fetchdata(); console.log(data); // output: data fetched console.log('processing data'); } catch (error) { …
3 / 20
le: const user = { name: 'john', age: 30, location: 'new york' }; // object destructuring const { name, age } = user; console.log(name); // output: john console.log(age); // output: 30 // array destructuring const numbers = [1, 2, 3]; const [a, b] = numbers; console.log(a); // output: 1 console.log(b); // output: 2 3.4 spread and rest operators the spread operator (...) allows an iterable (like an array or object) to be expanded in places where zero or more arguments or elements are expected. the rest operator collects multiple elements into an array. example: // spread operator const arr1 = [1, 2, 3]; const arr2 = [...arr1, 4, 5]; // [1, 2, 3, 4, 5] // rest operator function sum(...numbers) { return numbers.reduce((acc, num) => acc + num, 0); } console.log(sum(1, 2, 3, 4)); // output: 10 difference between spread and rest operators spread operator (...) : purpose : used …
4 / 20
; // output: hello, guest greet('alice'); // output: hello, alice 3. callback hell callback hell refers to a situation where multiple nested callbacks make the code difficult to read and maintain. this often happens when dealing with asynchronous operations like reading files, making api calls, or handling events. 3.1 example of callback hell: // simulating multiple asynchronous operations with callbacks function step1(callback) { settimeout(() => { console.log('step 1 complete'); callback(); }, 1000); } function step2(callback) { settimeout(() => { console.log('step 2 complete'); callback(); }, 1000); } function step3(callback) { settimeout(() => { console.log('step 3 complete'); callback(); }, 1000); } // nested callbacks leading to "callback hell" step1(() => { step2(() => { step3(() => { console.log('all steps complete'); }); }); }); 3.2 how to avoid callback hell: to avoid callback hell, you can use promises or async/await to flatten the code structure and make it more readable. using promises: function …
5 / 20
javascript tutorial 5: call, apply, bind, promises, and more - Page 5

Хотите читать дальше?

Скачайте все 20 страниц бесплатно через Telegram.

Скачать полный файл

О "javascript tutorial 5: call, apply, bind, promises, and more"

javascript tutorial 5: call, apply, bind, promises, and more 1. call, apply, and bind these three methods are used to explicitly set the value of this when calling a function. they allow you to control the context in which a function is executed. 1.1 call() the call() method calls a function with a given this value and arguments provided individually. syntax: function.call(thisarg, arg1, arg2, ...) example: const person = { name: 'alice', greet: function(greeting) { console.log(`${greeting}, my name is ${this.name}`); } }; const anotherperson = { name: 'bob' }; // using call to invoke greet with 'this' pointing to anotherperson person.greet.call(anotherperson, 'hello'); // output: hello, my name is bob 1.2 apply() the apply() method is similar to call(), but it …

Этот файл содержит 20 стр. в формате PPTX (265,3 КБ). Чтобы скачать "javascript tutorial 5: call, apply, bind, promises, and more", нажмите кнопку Telegram слева.

Теги: javascript tutorial 5: call, ap… PPTX 20 стр. Бесплатная загрузка Telegram