Le contenu de cet article concerne l'introduction de rendement dans es5 et aysnc/await dans es6 (avec des exemples). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. .
Récemment, j'ai lu des livres sur js pendant mon temps libre et j'ai également acheté des chroniques sur le front-end sur Geek Time. Pour une personne non-jser, j'ai toujours le sentiment : la communauté js est. Réel Radical et impétueux, ces décideurs ne semblent jamais savoir ce qu'est la retenue. Parfois, des choses inhérentes peuvent être traitées, mais ils préfèrent créer artificiellement certains concepts et sucres syntaxiques, en construisant artificiellement les uns après les autres, il semble que vous l'êtes. juste un "rookie" si vous ne l'avez pas franchi
S'il vous plaît, pardonnez-moi d'être vicieux Quand j'ai lu "JS Language Essence", j'ai eu un sentiment très fort. L'auteur est un maître dans l'industrie et. a également formulé json, mais chaque chapitre cite également une citation de Shakespeare au début, "Cela ne semble pas pertinent et il y a une philosophie cachée". De nombreux contenus dans le livre ont toujours un sens : cela peut être dit en 10 points pour faire un. Les gens ordinaires comprennent, je peux le comprendre clairement, mais je ne peux pas. Je ne dis que 6 points, et vous pouvez comprendre le reste par vous-même. Il y a beaucoup de choses ordinaires qui ne sont pas comprises par la compréhension, mais qui peuvent être soudainement comprises en expliquant. leur essence en quelques mots.
Dans le passé, j'aurais pensé que cette personne était une immense montagne à adorer. Ces dernières années, même si mes compétences ne sont toujours pas si bonnes, j'aime toujours y penser. certaines choses intérieures et travailler plus fort petit à petit. Le culte de l'autorité dans mon cœur a été supprimé. Quand je les revois, les signes de ponctuation "..." s'impriment facilement dans mon esprit. ou deux personnes, mais très probablement tout le cercle js est comme ça
Retour au titre, à part lire des livres, lire des chroniques et rechercher des informations, je n'ai toujours pas complètement compris les générateurs et async/. J'attends depuis longtemps, j'ai donc essayé de trier tout le processus en cours
J'essaie d'abord de ne rien suivre après le rendement. Vous pouvez le copier directement dans la sortie de la console
function *f0(param) { console.log('n: ' + param); yield; console.log('i'); let l = yield; console.log('l: ' + l); } let v0 = f0('p'); console.log(v0.next(1)); // 输出 n: p 和 {value: undefined, done: false} console.log('----'); console.log(v0.next(2)); // 输出 i 和 {value: undefined, done: false} console.log('----'); console.log(v0.next(3)); // 输出 l: 3 和 {value: undefined, done: true} console.log('----'); console.log(v0.next(4)); // 输出 {value: undefined, done: true} console.log('----'); console.log(v0.next(5)); // 输出 {value: undefined, done: true}
function *f1() { console.log('n'); yield; console.log('i'); let l = yield; console.log('l: ' + l); return '?'; } let v1 = f1(); console.log(v1.next(1)); // 输出 n 和 {value: undefined, done: false} console.log('----'); console.log(v1.next(11)); // 输出 i 和 {value: undefined, done: false} console.log('----'); console.log(v1.next(111)); // 输出 l: 111 和 {value: '?', done: true} console.log('----'); console.log(v1.next(1111)); // 输出 {value: undefined, done: true} console.log('----'); console.log(v1.next(11111)); // 输出 {value: undefined, done: true}
function *f2(param) { console.log('0: ' + param); let f = yield 1; console.log('1: ' + f); let s = yield f + 2; console.log('2: ' + s); let t = yield (s + 3); console.log('3: ' + t); let fo = (yield s) + 4; console.log('4: ' + fo); } let v2 = f2('p'); console.log(v2.next('N')); // 输出 0: p 和 {value: 1, done: false} console.log('----'); console.log(v2.next('I')); // 输出 1: I 和 {value: "I2", done: false} console.log('----'); console.log(v2.next('L')); // 输出 2: L 和 {value: "L3", done: false} console.log('----'); console.log(v2.next('S')); // 输出 3: S 和 {value: "L", done: false} console.log('----'); console.log(v2.next('H')); // 输出 4: H4 和 {value: undefined, done: true} console.log('----'); console.log(v2.next('I')); // 输出 {value: undefined, done: true} console.log('----'); console.log(v2.next('T')); // 输出 {value: undefined, done: true}
function *f3() { console.log('0'); let y1 = yield 1; console.log('1: ' + y1); let y2 = yield y1 + 2; console.log('2: ' + y2); let y3 = yield (y2 + 3); console.log('3: ' + y3); let y4 = (yield y3) + 4; console.log('4: ' + y4); return '??'; } let v3 = f3(); console.log(v3.next('N')); // 输出 0 和 {value: 1, done: false} console.log('----'); console.log(v3.next('I')); // 输出 1: I 和 {value: "I2", done: false} console.log('----'); console.log(v3.next('L')); // 输出 2: L 和 {value: "L3", done: false} console.log('----'); console.log(v3.next('S')); // 输出 3: S 和 {value: "S", done: false} console.log('----'); console.log(v3.next('H')); // 输出 4: H4 和 {value: "??", done: true} console.log('----'); console.log(v3.next('I')); // 输出 {value: undefined, done: true} console.log('----'); console.log(v3.next('T')); // 输出 {value: undefined, done: true}
// 下面 五行一起的竖线(|) 用一个大括号表示出来会更直观一点 function *f3() { // 调用第 1 次 next('N') 时运行的代码 console.log('0'); let y1 = yield 1; return 1; // | 封装成 {value: 1, done: false} 返回 // | // | 这两行等同于 let y1 = yield 1; // 调用第 2 次 next('I') 时运行的代码 // | let y1 = 'I'; // | console.log('1: ' + y1); return y1 + 2; // | 封装成 {value: "I2", done: false} 返回 // | // | 这两行等同于 let y2 = yield y1 + 2; // 调用第 3 次 next('L') 时运行的代码 // | let y2 = 'L'; // | console.log('2: ' + y2); return y2 + 3; // | 封装成 {value: "L3", done: false} 返回 // | // | 这两行等同于 let y3 = yield (y2 + 3); // 调用第 4 次 next('S') 时运行的代码 // | let y3 = 'S'; // | console.log('3: ' + y3); return y3; // | 封装成 {value: "S", done: false} 返回 // | // | 这两行等同于 let y4 = (yield y3) + 4; // 调用第 5 次 next('H') 时运行的代码 // | let y4 = 'H' // | console.log('4: ' + y4); return '??'; // 封装成 {value: "??", done: true} 返回 }
async function async1() { console.log('A'); console.log(await async2()); return 'B'; } async function async2() { console.log('C'); return 'D'; } console.log('E'); setTimeout(function() { console.log('F'); }, 0); async1().then(function(r) { console.log(r); }); new Promise(function(resolve, reject) { console.log('G'); resolve(); }).then(function() { console.log('H'); }); console.log('I');
// 这个 undefined 的意思应该主要是用来分隔宏任务的, 也就是前面的主线和任务队列是在一起的 E A C G I D H B undefined F
// 这个 undefined 的意思应该只是用来分隔主线的, 任务队列和宏任务在一起了 E A C G I undefined H D B F
// 这个 undefined 应该跟 chrome 里面是一样的 E A C G I H D B undefined F
Vidéo du didacticiel JavaScript du site Web PHP chinois !
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!