diff options
Diffstat (limited to 'files/vi/web/javascript/reference/functions/arguments')
| -rw-r--r-- | files/vi/web/javascript/reference/functions/arguments/index.html | 234 |
1 files changed, 234 insertions, 0 deletions
diff --git a/files/vi/web/javascript/reference/functions/arguments/index.html b/files/vi/web/javascript/reference/functions/arguments/index.html new file mode 100644 index 0000000000..ffcb00b472 --- /dev/null +++ b/files/vi/web/javascript/reference/functions/arguments/index.html @@ -0,0 +1,234 @@ +--- +title: The arguments object +slug: Web/JavaScript/Reference/Functions/arguments +translation_of: Web/JavaScript/Reference/Functions/arguments +--- +<p>{{JSSidebar("Functions")}}</p> + +<p><strong><code>arguments</code></strong> là object giống <code>Array</code> khả truy cập bên trong <a href="/en-US/docs/Web/JavaScript/Guide/Functions">hàm</a>, chứa các giá trị của đối số truyền vào trong hàm đó.</p> + +<div class="blockIndicator note"> +<p><strong>Ghi chú:</strong> Nếu bạn viết mã tương thích cho ES6, thì bạn nên tham khảo <a href="/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters">rest parameters</a>.</p> +</div> + +<div class="blockIndicator note"> +<p><strong>Ghi chú:</strong> “Giống Array” tức là <code>arguments</code> có thuộc tính {{jsxref("Functions/arguments/length", "length")}} và đánh chỉ mục từ không (0), nhưng nó không có phương thức dựng sẵn của {{JSxRef("Array")}} như {{jsxref("Array.forEach", "forEach()")}} và {{jsxref("Array.map", "map()")}}. Xem <a href="#Mô_tả">§Mô tả</a> để biết thêm chi tiết.</p> +</div> + +<div>{{EmbedInteractiveExample("pages/js/functions-arguments.html")}}</div> + + + +<h2 id="Cú_pháp">Cú pháp</h2> + +<pre class="syntaxbox">arguments</pre> + +<h2 id="Mô_tả">Mô tả</h2> + +<p>Object <code>arguments</code> là biến cục bộ có sẵn cho mọi hàm không phải <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">hàm mũi tên</a>. Bạn có thể tham chiếu tới đối số của một hàm bên trong hàm đó bằng cách sử dụng object <code>arguments</code>. Nó chứa từng đối số mà hàm đó được gọi cùng, với chỉ mục bắt đầu từ 0.</p> + +<p>Chẳng hạn, nếu một hàm được truyền vào 3 đối số, bạn có thể truy cập nó theo cách sau:</p> + +<pre class="brush: js">arguments[0] // đối số thứ nhất +arguments[1] // đối số thứ hai +arguments[2] // đối số thứ ba +</pre> + +<p>Mỗi đối số đều có thể thiết lập hoặc gán lại:</p> + +<pre class="brush: js">arguments[1] = 'new value'; +</pre> + +<p>Object <code>arguments</code> không phải là {{jsxref("Array")}}. Nó tương tự nhưng không có thuộc tính của <code>Array</code> ngoài {{jsxref("Array.length", "length")}}. Chẳng hạn, nó không có phương thức {{jsxref("Array.pop", "pop()")}}. Tuy nhiên, nó có thể ép kiểu về <code>Array</code>:</p> + +<pre class="brush: js">var args = Array.prototype.slice.call(arguments); +// Using an array literal is shorter than above but allocates an empty array +var args = [].slice.call(arguments); +</pre> + +<p>Như có thể làm với mọi object giống-Array, bạn có thể dùng phương thức {{jsxref("Array.from()")}} của ES2015 hoặc <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax">cú pháp spread</a> để ép kiểu <code>arguments</code> thành Array:</p> + +<pre class="brush: js">var args = Array.from(arguments); +var args = [...arguments]; +</pre> + +<p>Object <code>arguments</code> có ích đối với hàm được truyền nhiều đối số hơn so với khởi tạo ban đầu. Kỹ thuật này có ích với hàm cần được truyền nhiều biến, như là {{jsxref("Math.min()")}}. Hàm ví dụ dưới đây chấp nhật mọi xâu ký tự và trả về xâu dài nhất:</p> + +<pre class="brush: js">function longestString() { + var longest = ''; + for (var i=0; i < arguments.length; i++) { + if (arguments[i].length > longest.length) { + longest = arguments[i]; + } + } + return longest; +} +</pre> + +<p>Bạn có thể dùng {{jsxref("Functions/arguments/length", "arguments.length")}} để đếm số lượng đối số được truyền vào khi hàm được gọi. Thay vì thế, nếu bạn muốn đếm số lượng tham số chính quy mà hàm chấp nhận khi khởi tạo, hãy tham khảo thuộc tính {{jsxref("Function.length", "length")}} của hàm.</p> + +<h3 id="Sử_dụng_typeof_với_Arguments">Sử dụng <code>typeof</code> với Arguments</h3> + +<p>Toán tử {{jsxref("Operators/typeof", "typeof")}} trả về <code>'object'</code> khi dùng với <code>arguments</code></p> + +<pre class="brush: js">console.log(typeof arguments); // 'object' </pre> + +<p>Kiểu của từng đối số có thể xác định lần lượt bằng cách chỉ đích danh trong object <code>arguments</code>:</p> + +<pre>console.log(typeof arguments[0]); // trả về kiểu của đối số thứ nhất</pre> + +<h2 id="Thuộc_tính">Thuộc tính</h2> + +<dl> + <dt>{{jsxref("Functions/arguments/callee", "arguments.callee")}}</dt> + <dd>Tham chiếu tới hàm đang được thực thi sở hữu arguments.</dd> + <dt>{{jsxref("Functions/arguments/caller", "arguments.caller")}} {{Obsolete_Inline}}</dt> + <dd>Reference to the function that invoked the currently executing function.</dd> + <dt>{{jsxref("Functions/arguments/length", "arguments.length")}}</dt> + <dd>Số lượng đối số được truyền vào hàm.</dd> + <dt>{{jsxref("Functions/arguments/@@iterator", "arguments[@@iterator]")}}</dt> + <dd>Returns a new {{jsxref("Array/@@iterator", "<code>Array</code> iterator", "", 0)}} object that contains the values for each index in the <code>arguments</code>.</dd> +</dl> + +<h2 id="Ví_dụ">Ví dụ</h2> + +<h3 id="Định_nghĩa_hàm_nối_xâu_ký_tự">Định nghĩa hàm nối xâu ký tự</h3> + +<p>Ví dụ sau đây định nghĩa một hàm nối các xâu ký tự với nhau. Tham số chính quy mà hàm nhận là một xâu chứa các ký tự ngăn cách các xâu với nhau sau khi được nối.</p> + +<pre class="brush:js">function myConcat(separator) { + var args = Array.prototype.slice.call(arguments, 1); + return args.join(separator); +}</pre> + +<p>Bạn có thể truyền vào bao nhiêu xâu ký tự tuỳ ý. Giá trị trả về là một xâu chứa tất cả các đối số được truyền vào:</p> + +<pre class="brush:js">// trả về "red, orange, blue" +myConcat(', ', 'red', 'orange', 'blue'); + +// trả về "elephant; giraffe; lion; cheetah" +myConcat('; ', 'elephant', 'giraffe', 'lion', 'cheetah'); + +// trả về "sage. basil. oregano. pepper. parsley" +myConcat('. ', 'sage', 'basil', 'oregano', 'pepper', 'parsley');</pre> + +<h3 id="Định_nghĩa_hàm_sinh_danh_sách_HTML">Định nghĩa hàm sinh danh sách HTML</h3> + +<p>Ví dụ sau đây định nghĩa một hàm sinh ra một xâu ký tự chứa các thẻ HTML để tạo thành một danh sách. Tham số chính quy duy nhất mà hàm nhận là một ký tự như "<code>u</code>" nếu danh sách không có thứ tự (đánh dấu chấm), hay "<code>o</code>" nếu danh sách có thứ tự (đánh số). Hàm đó được định nghĩa như sau:</p> + +<pre class="brush:js">function list(type) { + var html = '<' + type + 'l><li>'; + var args = Array.prototype.slice.call(arguments, 1); + html += args.join('</li><li>'); + html += '</li></' + type + 'l>'; // end list + + return html; +}</pre> + +<p>Bạn có thể truyền bao nhiêu đối số tuỳ ý, và nó sẽ thêm từng đối số vào danh sách có kiểu xác định trước. Chẳng hạn:</p> + +<pre class="brush:js">var listHTML = list('u', 'One', 'Two', 'Three'); + +/* listHTML is: +"<ul><li>One</li><li>Two</li><li>Three</li></ul>" +*/</pre> + +<h3 id="Tham_số_rest_default_và_destructured">Tham số rest, default và destructured</h3> + +<p>Object <code>arguments</code> có thể dùng cùng lúc với các tham số như <a href="/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters">rest</a>, <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters">default</a>, và <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment">destructured</a>.</p> + +<pre class="brush: js">function foo(...args) { + return args; +} +foo(1, 2, 3); // [1,2,3] +</pre> + +<p>Tuy trong strict-mode, tham số rest, default, hoặc destructured parameters không can thiệp vào <a href="/en-US/docs/Web/JavaScript/Reference/Strict_mode#Making_eval_and_arguments_simpler">hành vi của object <code>arguments</code></a>, nhưng trong non-strict mode vẫn có không ít khác biệt.</p> + +<p>Nếu một hàm non-strict <strong>không</strong> chứa tham số rest, default, hay destructured, thì giá trị trong object <code>arguments</code> <strong>có</strong> thay đổi đồng bộ với giá trị của tham số truyền vào. Hãy xem đoạn mã dưới đây:</p> + +<pre class="brush: js">function func(a) { + arguments[0] = 99; // cập nhật arguments[0] cũng cập nhật a + console.log(a); +} +func(10); // 99 +</pre> + +<p>và</p> + +<pre class="brush: js">function func(a) { + a = 99; // cập nhật a cũng cập nhật arguments[0] + console.log(arguments[0]); +} +func(10); // 99 +</pre> + +<p>Khi hàm non-strict <strong>có</strong> chứa tham số rest, default hoặc destructured, thì giá trị trong object <code>arguments</code> <strong>không</strong> theo dõi giá trị của đối số. Thay vì vậy, chúng ánh xạ đến đối số truyền vào khi hàm được gọi:</p> + +<pre class="brush: js">function func(a = 55) { + arguments[0] = 99; // updating arguments[0] does not also update a + console.log(a); +} +func(10); // 10</pre> + +<p>và</p> + +<pre class="brush: js">function func(a = 55) { + a = 99; // updating a does not also update arguments[0] + console.log(arguments[0]); +} +func(10); // 10 +</pre> + +<p>và</p> + +<pre class="brush: js">// An untracked default parameter +function func(a = 55) { + console.log(arguments[0]); +} +func(); // undefined</pre> + +<h2 id="Đặc_tả_kĩ_thuật">Đặc tả kĩ thuật</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Đặc tả</th> + <th scope="col">Trạng thái</th> + <th scope="col">Ghi chú</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>Initial definition. Implemented in JavaScript 1.1</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-10.6', 'Arguments Object')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-arguments-exotic-objects', 'Arguments Exotic Objects')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Tương_thích_trình_duyệt">Tương thích trình duyệt</h2> + + + +<p>{{Compat("javascript.functions.arguments")}}</p> + +<h2 id="Xem_thêm">Xem thêm</h2> + +<ul> + <li>{{JSxRef("Function")}}</li> + <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters">Rest parameters</a></li> +</ul> |