From 236e9bd13893e83d539fddf22b257274818961a3 Mon Sep 17 00:00:00 2001 From: YiYingLin Date: Wed, 8 Jul 2020 16:21:43 +0800 Subject: [PATCH 1/3] translate 11-01-callbacks to zh-hant --- .../01-animate-circle-callback/task.md | 16 +- 1-js/11-async/01-callbacks/article.md | 137 +++++++++--------- 2 files changed, 76 insertions(+), 77 deletions(-) diff --git a/1-js/11-async/01-callbacks/01-animate-circle-callback/task.md b/1-js/11-async/01-callbacks/01-animate-circle-callback/task.md index 4a20ca604..13e26aeda 100644 --- a/1-js/11-async/01-callbacks/01-animate-circle-callback/task.md +++ b/1-js/11-async/01-callbacks/01-animate-circle-callback/task.md @@ -1,15 +1,15 @@ -# Animated circle with callback +# 使用回呼的動畫圈圈 -In the task an animated growing circle is shown. +在作業 中,成長的圈圈以動畫呈現。 -Now let's say we need not just a circle, but to show a message inside it. The message should appear *after* the animation is complete (the circle is fully grown), otherwise it would look ugly. +現在,假設我們需要的不只是圈圈,還要在裡面顯示訊息。訊息應該要出現在動畫完成(圈圈完全地成長)*之後*,否則它看起來會很醜。 -In the solution of the task, the function `showCircle(cx, cy, radius)` draws the circle, but gives no way to track when it's ready. +在該項作業的解答中,函式 `showCircle(cx, cy, radius)` 畫了圈圈,但沒有提供追蹤它完成的方法。 -Add a callback argument: `showCircle(cx, cy, radius, callback)` to be called when the animation is complete. The `callback` should receive the circle `
` as an argument. +增加一個回呼參數:`showCircle(cx, cy, radius, callback)` 讓它在動畫完成後被呼叫。 `callback` 應該要接收圈圈的 `
` 作為參數。 -Here's the example: +範例如下: ```js showCircle(150, 150, 100, div => { @@ -18,8 +18,8 @@ showCircle(150, 150, 100, div => { }); ``` -Demo: +範例: [iframe src="solution" height=260] -Take the solution of the task as the base. +將該作業的解答 當作基底。 diff --git a/1-js/11-async/01-callbacks/article.md b/1-js/11-async/01-callbacks/article.md index 9d1a260d5..deb0b1dc0 100644 --- a/1-js/11-async/01-callbacks/article.md +++ b/1-js/11-async/01-callbacks/article.md @@ -1,68 +1,67 @@ -# Introduction: callbacks +# 介紹: 回呼 ```warn header="We use browser methods in examples here" -To demonstrate the use of callbacks, promises and other abstract concepts, we'll be using some browser methods: specifically, loading scripts and performing simple document manipulations. +為了示範回呼、promise 及其他抽象概念的使用,我們將會使用一些瀏覽器的函式:更具體地說,載入腳本以及執行簡單的文件操作。 -If you're not familiar with these methods, and their usage in the examples is confusing, you may want to read a few chapters from the [next part](/document) of the tutorial. +如果你並不熟悉這些方法,亦或是對於範例中的使用方式感到困惑,你可能會想要閱讀[下一部分](/document)教程中的一些章節。 -Although, we'll try to make things clear anyway. There won't be anything really complex browser-wise. +我們會試著讓事情保持單純。不會有任何瀏覽器方面的複雜事物。 ``` -Many functions are provided by JavaScript host environments that allow you to schedule *asynchronous* actions. In other words, actions that we initiate now, but they finish later. +許多函式是由 JavaScript 的執行環境所提供,這些函式允許你安排*非同步*的動作。換句話說,我們現在啟動的動作,將在未來的某一刻完成。 -For instance, one such function is the `setTimeout` function. +舉例來說, `setTimeout` 就是一個這樣的函式。 -There are other real-world examples of asynchronous actions, e.g. loading scripts and modules (we'll cover them in later chapters). +真實世界中,還有其它非同步動作的例子。像是載入腳本及模組(我們會在後續的章節中介紹它們)。 -Take a look at the function `loadScript(src)`, that loads a script with the given `src`: +看看下面的 `loadScript(src)` 函式,它載入了指定 `src` 位置的腳本: ```js function loadScript(src) { - // creates a