diff --git a/README.md b/README.md index cb9cb3d4..be02cfd5 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,18 @@ JavaScript Garden ================= +2024 update: this project has not been actively maintained in years. The original author +[took the site down](https://github.com/BonsaiDen/JavaScript-Garden/commit/93278fbcafa569fd193f8784abc267e9db09c645) +in 2022 (no judgement - updating it would be a big project!). At that point it was already long out of date, e.g. missing +the new language features from ES6 onwards. + +Many excellent modern guides exist, e.g. [Eloquent Javascript](https://eloquentjavascript.net/), or +the [MDN guide](https://developer.mozilla.org/en-US/docs/Web/JavaScript). + +Thanks for all the maintainers and translators over the years! + +----- + **JavaScript Garden** is a growing collection of documentation about the most quirky parts of the JavaScript programming language. It gives advice to avoid common mistakes, subtle bugs, as well as performance issues and bad @@ -19,7 +31,7 @@ This guide is the work of two lovely Stack Overflow users, [Ivo Wetzel][6] [many others](https://github.com/BonsaiDen/JavaScript-Garden/graphs/contributors) who've worked hard to provide translations or fixes. -It's currently maintained by [Tim Ruffles](http://twitter.com/timruffles). +It was maintained by [Tim Ruffles](http://twitter.com/timruffles) from 2013-2020ish. ## Contributing diff --git a/doc/es/function/constructors.md b/doc/es/function/constructors.md index 0850cb4b..9c4e2946 100644 --- a/doc/es/function/constructors.md +++ b/doc/es/function/constructors.md @@ -48,7 +48,7 @@ Cuando una `nueva` keyword es omitidad, la función **no** devuelve un nuevo obj } Foo(); // undefined -Auqnue el ejemplo anterior puede parecer que trabaja en algunos casos, debido +Aunque el ejemplo anterior puede parecer que trabaja en algunos casos, debido a los trabajos de [`this`](#function.this) en JavaScript, que usará el *objeto global* como valor de `this`. diff --git a/doc/es/function/scopes.md b/doc/es/function/scopes.md index d641a939..00ed940c 100644 --- a/doc/es/function/scopes.md +++ b/doc/es/function/scopes.md @@ -47,7 +47,7 @@ mayor implicación. test(); foo; // 21 -Dejando de lador la sentencia `var` dentro de la función `test` sobre escribiría el +Dejando de lado la sentencia `var` dentro de la función `test` sobre escribiría el valor de `foo`. Si bien al principio puede parecer un gran cambio, se tiene miles de líneas de código en JavaScript y no se usaría `var` introduciendose en un horrible y difícil detección de errores. @@ -68,7 +68,7 @@ horrible y difícil detección de errores. El bucle externo terminará después de la primera llamada a `subLoop`, desde `subLoop` sobreescribe el valor global de `i`. Usando `var` para el segundo bucle `for` se hace fácil evitar este error. La sentencia `var` no debe **nunca** dejarse a menos que -el *efecto deseado* es afectado por el ámbito exteriror. +el *efecto deseado* es afectado por el ámbito exterior. ### Variables locales diff --git a/doc/zhtw/array/constructor.md b/doc/zhtw/array/constructor.md index 6c66656d..fd952497 100644 --- a/doc/zhtw/array/constructor.md +++ b/doc/zhtw/array/constructor.md @@ -10,7 +10,7 @@ new Array('3') // 結果: ['3'] 在上面的範例 `new Array(3)` 當只有一個參數傳入到 `Array` 的建構函數 -且那個參數事宜個數字,建構函數會回傳空值 +且那個參數是一個數字,建構函數會回傳空值 但是 `Array` 長度的屬性會變成跟那個參數一樣(以此範例來看他回傳的長度為 3) **注意** 只有他長度的屬性會被設定,整個 Array裡面的數值都不會初始化 diff --git a/doc/zhtw/array/general.md b/doc/zhtw/array/general.md index e9de8782..1a59d72e 100644 --- a/doc/zhtw/array/general.md +++ b/doc/zhtw/array/general.md @@ -7,7 +7,7 @@ > 只有 [objects](#object.general) 來管理建值的相對應關係 > Arrays 是**保持** 順序的,Objects **則沒有** -因為 `for in` 迴圈會列舉所有在原型 Array 上的屬性因為他會使用[`hasOwnProperty`](#object.hasownproperty), 這會使得 Array 比原本的 `for` 迴圈慢上二十幾倍 +因為 `for in` 迴圈會使用[`hasOwnProperty`](#object.hasownproperty),所以它會列舉所有在原型 Array 上的屬性,這會使得 Array 比原本的 `for` 迴圈慢上二十幾倍 ### 迴圈 @@ -20,8 +20,8 @@ 在上面的例子中利用 `l = list.length` 來處理 Array 的長度問題。 -雖然 `length` 屬性是屬於 Array 中其中一個屬性,但是他還使有一定的性能消耗在每次循環的訪問。 -近期 Javascript 使用 **may** 來解決在這上面的效率問題,但是在現在的引擎上還不一定有支援。 +雖然 `length` 屬性是屬於 Array 中其中一個屬性,但是他在每次循環還是有一定的性能消耗。 +近期 Javascript **可能**使用來解決在這上面的效率問題,但是在現在的引擎上還不一定有支援。 實際上,不使用暫存 Array 長度的方式比使用暫存的版本還要慢很多。 diff --git a/doc/zhtw/core/undefined.md b/doc/zhtw/core/undefined.md index 491f8528..501dfb95 100644 --- a/doc/zhtw/core/undefined.md +++ b/doc/zhtw/core/undefined.md @@ -1,6 +1,6 @@ ## `undefined` 和 `null` -JavaScript 中有兩個表示空值的方式, `null` 和 `undefined` , `undefined`式比較常用的一種。 +JavaScript 中有兩個表示空值的方式, `null` 和 `undefined` , `undefined`是比較常用的一種。 ### `undefined` 的值 diff --git a/doc/zhtw/function/arguments.md b/doc/zhtw/function/arguments.md index 7cb76032..39aa58f0 100644 --- a/doc/zhtw/function/arguments.md +++ b/doc/zhtw/function/arguments.md @@ -18,7 +18,7 @@ Array.prototype.slice.call(arguments); -這種轉化方式比較 **慢** ,不建議使用這種作法如果再追求效率的程式中。 +這種轉化方式比較 **慢** ,如果在追求效率的程式中,不建議使用這種作法。 ### 傳遞參數 @@ -53,7 +53,7 @@ 在 `Arguments` 物件創造的 *getter* 和 *setter* 的函數方法,可以被視為原本函數的變數。 -因此,改變了一個變數會跟著改變它的值而且也間接的改變稻香對應的 `arguments` 的物件,反之亦然。 +因此,改變了一個形式參將數會跟著改變對應的 `arguments` 的屬性,反之亦然。 function foo(a, b, c) { arguments[0] = 2; diff --git a/doc/zhtw/function/scopes.md b/doc/zhtw/function/scopes.md index 3e151282..d443656f 100644 --- a/doc/zhtw/function/scopes.md +++ b/doc/zhtw/function/scopes.md @@ -160,7 +160,7 @@ JavaScript 中所有的作用區,包括 *全域作用域*,都有一個特殊 1. 當作用域內是否有 `var foo` 的定義。 2. 函式形式參數是否有使用 `foo` 名稱定義。 - 3. 函式自身是剖叫做 `foo`。 + 3. 函式自身是否叫做 `foo`。 4. 回溯到上一個層級然後再從第一個開始往下去查。 > **注意: ** 自定義 `arguments` 參數會阻止原生的 `arguments` 的物件創立 diff --git a/doc/zhtw/function/this.md b/doc/zhtw/function/this.md index 116a70df..361a06c4 100644 --- a/doc/zhtw/function/this.md +++ b/doc/zhtw/function/this.md @@ -1,6 +1,6 @@ ## `this` 的工作原理 -JavaScript 有移到完全部屬於其他語言處理 `this` 的處理機制。 +JavaScript 有一道完全不屬於其他語言處理 `this` 的處理機制。 在 **五** 種不同的情況下, `this` 指向的各不相同 ### 全域變數 @@ -42,8 +42,7 @@ JavaScript 有移到完全部屬於其他語言處理 `this` 的處理機制。 當使用 `function.prototype` 上的 `call` 或只 `apply` 方法時,函式內的 `this` 將會被 **顯示設置** 為函式調用的第一個參數。 -As a result, in the above example the *method case* does **not** apply, and `this` -inside of `foo` will be set to `bar`. +因此,在以上的例子中已不適用*函式調用*的原則,而且`this`會被設定指向`bar`。 > **Note:** `this` **cannot** be used to refer to the object inside of an `Object` > literal. So `var obj = {me: this}` will **not** result in `me` referring to @@ -51,56 +50,48 @@ inside of `foo` will be set to `bar`. ### 常見誤解 -While most of these cases make sense, the first can be considered another -mis-design of the language because it **never** has any practical use. +儘管大部分的例子都合理,但第一個例子(譯者注: 應該是指前面呼叫一個函式的那個例子)可以被視為一個語言的不良設計,因為它**從來**就沒有實際用途。 Foo.method = function() { function test() { - // this is set to the global object + // this 設定為全域 } test(); }; -A common misconception is that `this` inside of `test` refers to `Foo`; while in -fact, it **does not**. +一個常見的誤解是 `test` 中的 `this` 指向 `Foo` 物件,但實際上並**不是**。 -In order to gain access to `Foo` from within `test`, it is necessary to create a -local variable inside of `method` that refers to `Foo`. +為了在 `test` 中使用 `Foo` 物件,我們需要在 `method` 函式内部建立一個區域變數指向 `Foo`。 Foo.method = function() { var that = this; function test() { - // Use that instead of this here + // 這裡使用 that 而非 this } test(); }; -`that` is just a normal variable name, but it is commonly used for the reference to an -outer `this`. In combination with [closures](#function.closures), it can also -be used to pass `this` values around. +`that` 只是普通的名字,不過這個名字常被用用來指向外部的 `this`。 在 [閉包](#function.closures) 一節,可以看到它(`that`)可以取代 `this` 傳遞。 -As of ECMAScript 5 you can use the `bind` method combined with an anonymous function to achieve the same result. +在 ECMAScript 5 ,你可以使用 `bind` 結合匿名函式達到相同結果。 Foo.method = function() { var test = function() { - // this now refers to Foo + // this 指向 Foo }.bind(this); test(); }; -### Assigning Methods +### 函式表達式 -Another thing that does **not** work in JavaScript is function aliasing, which is -**assigning** a method to a variable. +另一個在 JavaScript 中**不會**運作的就是 function aliasing,也就是函式**賦值**給一個變數。 var test = someObject.methodTest; test(); -Due to the first case, `test` now acts like a plain function call; therefore, -`this` inside it will no longer refer to `someObject`. +上例中,`test` 就像一個普通的函式被调用;因此,函式内的 this 將不再指向 `someObject`。 -While the late binding of `this` might seem like a bad idea at first, in -fact, it is what makes [prototypal inheritance](#object.prototype) work. +雖然起初 `this` 的绑定特性似乎像是個壞主意,但事實上,它使得 [原型繼承](#object.prototype)得以運作。 function Foo() {} Foo.prototype.method = function() {}; @@ -110,7 +101,5 @@ fact, it is what makes [prototypal inheritance](#object.prototype) work. new Bar().method(); -When `method` gets called on an instance of `Bar`, `this` will now refer to that -very instance. - +當 `method` 被呼叫時,`this` 將會指向 `Bar` 的實體物件。 diff --git a/doc/zhtw/object/general.md b/doc/zhtw/object/general.md index aee1885c..6cd56600 100644 --- a/doc/zhtw/object/general.md +++ b/doc/zhtw/object/general.md @@ -69,7 +69,7 @@ JavaScript 的物件可以作為 [*Hashmaps*][1]使用,主要用來保存命 只有 `baz` 真正被刪除而已,所以從輸出結果中消失。 -### 屬姓名的語法 +### 屬性名的語法 var test = { 'case': 'I am a keyword, so I must be notated as a string', diff --git a/doc/zhtw/types/instanceof.md b/doc/zhtw/types/instanceof.md index 5bdb00d2..fa5e8c30 100644 --- a/doc/zhtw/types/instanceof.md +++ b/doc/zhtw/types/instanceof.md @@ -1,6 +1,6 @@ ## `instanceof` 操作符 -`instanceof` 操作符用來比較兩個建構函數的操作數。只有在比較字定義的物件時才有意義。這和 [typeof operator](#types.typeof)一樣用處不大。 +`instanceof` 操作符用來比較兩個建構函數的操作數。只有在比較自定義的物件時才有意義。這和 [typeof operator](#types.typeof)一樣用處不大。 ### 比較定意義物件 @@ -24,7 +24,7 @@ 'foo' instanceof String; // false 'foo' instanceof Object; // false -有一點需要注意的, `instanceof` 不能用來物件來自上下文不同的屬性(例如:瀏覽器中不同的文檔結構),因為它的建構函數不一樣。 +有一點需要注意的, `instanceof` 不會在來自不同的上下文的物件運作(例如:瀏覽器中不同的文檔結構),因為它的建構函數不一樣。 ### In Conclusion diff --git a/doc/zhtw/types/typeof.md b/doc/zhtw/types/typeof.md index 7058e55b..0a0908b0 100644 --- a/doc/zhtw/types/typeof.md +++ b/doc/zhtw/types/typeof.md @@ -3,7 +3,7 @@ `typeof` 操作符 (和 [`instanceof`](#types.instanceof)) 可能是最大的設計錯誤在 JavaScript,因為它幾乎不可能從它們那裡得到想要的結果。 -雖然 `instanceof` 還是有一些限制上的使用, `typeof` 只有一個實際上的運傭情形,但是 **不是** 用在檢查物件的類型。 +雖然 `instanceof` 還是有一些限制上的使用, `typeof` 只有一個實際上的運用情形,但是 **不是** 用在檢查物件的類型。 > **注意:** 由於 `typeof` 也可以像函式的語法被調用,例如 `typeof(obj)`,但這並是一個函數調用。 > 那兩個小括號只是用來計算一個表達式的值,這個返回值會作為 `typeof` 操作符的一個操作數。 @@ -67,8 +67,8 @@ JavaScript 標準文檔只給出了一種獲取 `[[Class]]` 值的方法,那 ### 結語 為了去檢查一個物件,強烈建議去使用 `Object.prototype.toString` 因為這是唯一可以依賴的方式。 -正如上面所看到的 `typeof` 的亦先返回值在標準文檔中未定義,因此不同的引擎可能不同。 +正如上面所看到的 `typeof` 的事先返回值在標準文檔中未定義,因此不同的引擎可能不同。 -除非為了檢測一個變數是否定義,我們應該避免是用 `typeof` 操作符。 +除非為了檢測一個變數是否定義,我們應該避免使用 `typeof` 操作符。