{"id":3318,"date":"2018-03-19T10:00:45","date_gmt":"2018-03-19T04:30:45","guid":{"rendered":"https:\/\/code4developers.com\/?p=3318"},"modified":"2023-10-16T00:06:34","modified_gmt":"2023-10-15T18:36:34","slug":"arguments-object-javascript-function","status":"publish","type":"post","link":"https:\/\/code4developers.com\/arguments-object-javascript-function\/","title":{"rendered":"arguments object in JavaScript function"},"content":{"rendered":"

The arguments<\/strong><\/em> object is an Array-like object matching to the arguments passed to a function. The arguments object is a local variable available within all (non-arrow) functions. You can refer to a function’s arguments within the function by using the arguments object.Let’s consider below code:<\/p>\n

function addition(num1, num2) { \r\n  return num1 + num2; \r\n} \r\naddition(10,20);<\/pre>\n
In above code, we are calling function “addition()” passing 10 and 20 for “num1” and “num2”. So, the function will return an answer 30. Now what if we pass one more arguments while calling function “addition()”? Let’s do it:<\/p>\n
function addition(num1, num2) { \r\n  return num1 + num2; \r\n} \r\naddition(10,20,25);<\/pre>\n
Will this function “addition()” throw an error? Answer is no. It will return an answer 30.<\/strong> So, here comes one more question. What happen to the value 25? Answer is, it will be there in arguments <\/strong><\/em>object.<\/p>\n
Let’s consider below code to access all the passed arguments using arguments object<\/p>\n
function addition(num1, num2) { \r\n  return arguments[0] + arguments[1] + arguments[2]; \r\n} \r\naddition(10,20,25);<\/pre>\n
In above code, we are able to access all the passed arguments and the function “addition()” will return an answer 55 here. In JavaScript we can access all the passed arguments using arguments objects and this object contains an entry for each argument passed to the function, the first entry’s index starting at 0.<\/p>\n
arguments object is an array-like object<\/h4>\n
In above example we can see the code where we are accessing arguments object same as we access an array. But we can’t say arguments object a pure array, because it does not provide all the properties which array provides. It provides only length<\/strong> property which make it an array-like object. If you will try anything else than length in arguments object it will throw an exception calling “…is not a function”.<\/p>\n
Modify an arguments object<\/h4>\n
We can modify or set an value to the arguments object. Refer below code:<\/p>\n
function addition(num1, num2) { \r\n  arguments[0] = 5;\r\n  return arguments[0] + arguments[1] + arguments[2]; \r\n} \r\naddition(10,20,25);<\/pre>\n
We have used same code as our previous example, here we are setting first argument to the number 5 and it will get updated. So, this function “addition()” will return an answer 50.<\/p>\n
Convert arguments object to a pure array<\/h4>\n
As we discussed, arguments object is not an array, but it is array like object. So, how to convert it to the pure array. Let’s consider below code<\/p>\n
var args = Array.prototype.slice.call(arguments);\r\n\r\nOR\r\n\r\nvar args = [].slice.call(arguments);<\/pre>\n
In ECMAScript 6 we can achieve same as below<\/p>\n
var args = Array.from(arguments);<\/pre>\n
We can also do it using spread operator<\/a><\/p>\n
var args = [...arguments];<\/pre>\n
Interested in JavaScript? Click here to read more JavaScript articles in Code4Developers<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
The arguments object is an Array-like object matching to the arguments passed to a function. The arguments object is a local variable available within all (non-arrow) functions. You can refer…<\/p>\n","protected":false},"author":4,"featured_media":3127,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[2],"tags":[782,783,22,784],"powerkit_post_featured":[],"class_list":{"0":"post-3318","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-javascript","8":"tag-arguments","9":"tag-function","10":"tag-javascript","11":"tag-object"},"jetpack_featured_media_url":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p8NAi4-Rw","jetpack-related-posts":[{"id":3311,"url":"https:\/\/code4developers.com\/default-parameter-in-a-javascript-function\/","url_meta":{"origin":3318,"position":0},"title":"Default Parameter in JavaScript function","author":"Yatendrasinh Joddha","date":"March 17, 2018","format":false,"excerpt":"In any programming language we often require having default parameter or default value for the parameter in a function. JavaScript allow us to initialize parameter a default value. If you are not passing any value to the parameter, then the default value of the parameter will be undefined. Let's consider\u2026","rel":"","context":"In "JavaScript"","block_context":{"text":"JavaScript","link":"https:\/\/code4developers.com\/category\/javascript\/"},"img":{"alt_text":"javascript","src":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=700%2C400 2x"},"classes":[]},{"id":3321,"url":"https:\/\/code4developers.com\/spread-syntax-in-javascript\/","url_meta":{"origin":3318,"position":1},"title":"Spread syntax (three dots) in JavaScript","author":"Yatendrasinh Joddha","date":"March 21, 2018","format":false,"excerpt":"Spread syntax which is used by typing three dots (...) in JavaScript. It allows an array expression or string or anything which can be iterating to be expanded in places where zero or more arguments for function calls\u00a0or elements for array are expected. It can also be used for an\u2026","rel":"","context":"In "JavaScript"","block_context":{"text":"JavaScript","link":"https:\/\/code4developers.com\/category\/javascript\/"},"img":{"alt_text":"javascript","src":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=700%2C400 2x"},"classes":[]},{"id":3106,"url":"https:\/\/code4developers.com\/javascript-template-literals\/","url_meta":{"origin":3318,"position":2},"title":"Javascript: What Are Template Literals?","author":"Arif Khoja","date":"September 30, 2017","format":false,"excerpt":"ES6 introduced two types of literals: Template Literals and Tagged Template Literals to tag Template Literals. In this post, we cover both of them in depth! In ES6, two types of literals were introduced: Template Literals for string concatenation and expression embedding in a string Tagged Template Literals to tag\u2026","rel":"","context":"In "JavaScript"","block_context":{"text":"JavaScript","link":"https:\/\/code4developers.com\/category\/javascript\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/06\/thumb-1-e1498942297714.png?fit=240%2C269&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":2662,"url":"https:\/\/code4developers.com\/ecmascript-5-strict-mode-json\/","url_meta":{"origin":3318,"position":3},"title":"ECMAScript5 Strict Mode, JSON, and More….","author":"Arif Khoja","date":"June 25, 2017","format":false,"excerpt":"Introduction There are a number of other new features and APIs that need attention, as well. The largest of which are\u00a0Strict Mode\u00a0and native\u00a0JSON\u00a0support. Strict Mode Strict Mode is a new feature in ECMAScript 5 that allows you to place a program, or a function, in a \u201cstrict\u201d operating context. This\u2026","rel":"","context":"In "JavaScript"","block_context":{"text":"JavaScript","link":"https:\/\/code4developers.com\/category\/javascript\/"},"img":{"alt_text":"javascript","src":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2017\/10\/javascript.jpg?fit=750%2C422&ssl=1&resize=700%2C400 2x"},"classes":[]},{"id":7069,"url":"https:\/\/code4developers.com\/ways-to-use-generator-functions-in-javascript\/","url_meta":{"origin":3318,"position":4},"title":"Ways to use Generator Functions in JavaScript","author":"Arif Khoja","date":"May 15, 2020","format":false,"excerpt":"In this Article we will see below points Generator Functions Recap: Functions How does it work? 4 ways to use Generator Functions with Examples Advantages of using Generator function What are Generator Functions? Ever imagined what would happen if a function had an infinite input or output to deal with?\u2026","rel":"","context":"In "JavaScript"","block_context":{"text":"JavaScript","link":"https:\/\/code4developers.com\/category\/javascript\/"},"img":{"alt_text":"Functional-programming-js","src":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2020\/04\/avatar-js.png?fit=512%2C512&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":6797,"url":"https:\/\/code4developers.com\/functional-programming-currying\/","url_meta":{"origin":3318,"position":5},"title":"Functional Programming in Javascript – Currying","author":"Arif Khoja","date":"April 7, 2020","format":false,"excerpt":"Currying is an advanced technique of working with functions. It\u2019s used not only in JavaScript, but in other languages as well. Currying is a transformation of functions that translates a function from callable as\u00a0f(a, b, c) \u00a0into callable as\u00a0f(a)(b)(c). Currying doesn\u2019t call a function. It just transforms it.Let\u2019s see an\u2026","rel":"","context":"In "JavaScript"","block_context":{"text":"JavaScript","link":"https:\/\/code4developers.com\/category\/javascript\/"},"img":{"alt_text":"Functional-programming-js","src":"https:\/\/i0.wp.com\/code4developers.com\/wp-content\/uploads\/2020\/04\/avatar-js.png?fit=512%2C512&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]}],"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/posts\/3318","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/comments?post=3318"}],"version-history":[{"count":4,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/posts\/3318\/revisions"}],"predecessor-version":[{"id":3396,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/posts\/3318\/revisions\/3396"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/media\/3127"}],"wp:attachment":[{"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/media?parent=3318"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/categories?post=3318"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/tags?post=3318"},{"taxonomy":"powerkit_post_featured","embeddable":true,"href":"https:\/\/code4developers.com\/wp-json\/wp\/v2\/powerkit_post_featured?post=3318"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}