{"id":1097,"date":"2023-11-05T09:03:04","date_gmt":"2023-11-05T09:03:04","guid":{"rendered":"https:\/\/seostudio.tools\/blog\/?p=1097"},"modified":"2023-11-05T09:07:47","modified_gmt":"2023-11-05T09:07:47","slug":"three-dots-in-javascript","status":"publish","type":"post","link":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/","title":{"rendered":"What Do The Three Dots (&#8230;) Mean in JavaScript?"},"content":{"rendered":"\n<p>In JavaScript, the three dots (&#8230;) serve as two distinct operators depending on their context.<\/p>\n\n\n\n<ol>\n<li><strong>The Spread operator<\/strong> allows for elements of iterable objects, like arrays, or properties of objects to be expanded or distributed.<\/li>\n\n\n\n<li><strong>The Rest operator<\/strong> collects a list of arguments into an array when working with function parameters, or collects remaining object properties when destructuring.<\/li>\n<\/ol>\n\n\n\n<p>These operators add to the flexibility and expressiveness of JavaScript, making the manipulation of arrays, objects, and function arguments more succinct and intuitive, they both utilize the same ellipsis syntax, but their functions are quite different.<\/p>\n\n\n\n<p>Read <a href=\"https:\/\/seostudio.tools\/blog\/dollar-sign-in-javascript\/\">What Does \u2018$\u2019 Mean in JavaScript?<\/a><\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_66_1 ez-toc-wrap-left counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title ez-toc-toggle\" style=\"cursor: pointer\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #7f7f7f;color:#7f7f7f\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #7f7f7f;color:#7f7f7f\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 eztoc-toggle-hide-by-default' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#First_The_Spread_Operator\" title=\"First: The Spread Operator\">First: The Spread Operator<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#1_Array_and_Iterable_Expansion\" title=\"1. Array and Iterable Expansion:\">1. Array and Iterable Expansion:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#2_Function_Arguments_from_Array\" title=\"2. Function Arguments from Array:\">2. Function Arguments from Array:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#3_Object_Cloning\" title=\"3. Object Cloning:\">3. Object Cloning:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#4_Merging_Arrays\" title=\"4. Merging Arrays:\">4. Merging Arrays:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#5_Array_Concatenation\" title=\"5. Array Concatenation:\">5. Array Concatenation:<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#Second_The_Rest_Operator\" title=\"Second: The Rest Operator\">Second: The Rest Operator<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#1_Function_Parameters_into_an_Array\" title=\"1. Function Parameters into an Array:\">1. Function Parameters into an Array:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#2_Destructuring_Arrays_Elements\" title=\"2. Destructuring Arrays Elements:\">2. Destructuring Arrays Elements:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#3_Destructuring_Object_Properties\" title=\"3. Destructuring Object Properties:\">3. Destructuring Object Properties:<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"First_The_Spread_Operator\"><\/span>First: The Spread Operator<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>The Spread Operator can be used in many cases, such as combining arrays, merging, copying, and more.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"1_Array_and_Iterable_Expansion\"><\/span>1. Array and Iterable Expansion:<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>One of the primary uses of the Spread operator is to expand elements of an array or other iterable objects into individual elements:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nconst greeting = &#039;Hello&#039;;\nconst chars = &#x5B;...greeting];\nconsole.log(chars); \/\/ Outputs: &#x5B;&#039;H&#039;, &#039;e&#039;, &#039;l&#039;, &#039;l&#039;, &#039;o&#039;]\n\n<\/pre><\/div>\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2_Function_Arguments_from_Array\"><\/span>2. Function Arguments from Array:<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>When applied in function calls, it can pass the elements of an array as individual arguments to a function.<\/p>\n\n\n\n<ul>\n<li>Example 1:<\/li>\n<\/ul>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nconst numbers = &#x5B;1, 2, 3];\nconst maxNumber = Math.max(...numbers); \/\/ Same as Math.max(1, 2, 3)\n<\/pre><\/div>\n\n\n<p>Example 2:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nfunction sum(x, y, z) {\n  return x + y + z;\n}\n\nconst numbers = &#x5B;1, 2, 3];\nconsole.log(sum(...numbers)); \/\/ Outputs: 6\n<\/pre><\/div>\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"3_Object_Cloning\"><\/span>3. Object Cloning:<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>The Spread operator can be used to copy properties from one object to another, creating a new object.<\/p>\n\n\n\n<p>Example 1:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nconst obj = { a: 1, b: 2 };\nconst copy = { ...obj }; \/\/ { a: 1, b: 2 }\n<\/pre><\/div>\n\n\n<p>Example 2:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nconst user = { name: &#039;John&#039;, age: 30 };\nconst userWithId = { ...user, id: &#039;123&#039; };\nconsole.log(userWithId); \/\/ Outputs: { name: &#039;John&#039;, age: 30, id: &#039;123&#039; }\n<\/pre><\/div>\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"4_Merging_Arrays\"><\/span>4. Merging Arrays:<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Merges properties from multiple objects into a new object.<\/p>\n\n\n\n<p>Example 1:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nconst defaults = { a: 1, b: 2 };\nconst options = { b: 3, c: 4 };\nconst settings = { ...defaults, ...options }; \/\/ { a: 1, b: 3, c: 4 }\n<\/pre><\/div>\n\n\n<p>Example 2:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nconst fruits = &#x5B;&#039;apple&#039;, &#039;banana&#039;];\nconst moreFruits = &#x5B;&#039;orange&#039;, &#039;grape&#039;];\n\nconst allFruits = &#x5B;...fruits, ...moreFruits];\nconsole.log(allFruits); \/\/ Outputs: &#x5B;&#039;apple&#039;, &#039;banana&#039;, &#039;orange&#039;, &#039;grape&#039;]\n<\/pre><\/div>\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"5_Array_Concatenation\"><\/span>5. Array Concatenation:<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Combines two or more arrays:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nconst arr1 = &#x5B;1, 2];\nconst arr2 = &#x5B;3, 4];\nconst combined = &#x5B;...arr1, ...arr2]; \/\/ &#x5B;1, 2, 3, 4]\n<\/pre><\/div>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Second_The_Rest_Operator\"><\/span>Second: The Rest Operator<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>While it looks identical to the Spread operator, the Rest operator is used to condense multiple elements into an array.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"1_Function_Parameters_into_an_Array\"><\/span>1. Function Parameters into an Array:<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>When defining function parameters, the Rest operator allows us to gather any number of arguments into an array.<\/p>\n\n\n\n<p>Example 1:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nfunction logArguments(...args) {\n  console.log(args);\n}\nlogArguments(1, 2, 3); \/\/ &#x5B;1, 2, 3]\n<\/pre><\/div>\n\n\n<p>Example 2:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nfunction multiply(multiplier, ...theArgs) {\n  return theArgs.map(element =&gt; multiplier * element);\n}\n\nconst result = multiply(2, 1, 2, 3);\nconsole.log(result); \/\/ Outputs: &#x5B;2, 4, 6]\n<\/pre><\/div>\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2_Destructuring_Arrays_Elements\"><\/span>2. Destructuring Arrays Elements:<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>The Rest operator is handy at capturing all remaining elements in an array during destructuring.<\/p>\n\n\n\n<p>Example 1:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nconst &#x5B;first, ...rest] = &#x5B;1, 2, 3, 4]; \/\/ first = 1, rest = &#x5B;2, 3, 4]\n<\/pre><\/div>\n\n\n<p>Example 2:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nconst &#x5B;first, ...restOfItems] = &#x5B;10, 20, 30, 40];\nconsole.log(first); \/\/ Outputs: 10\nconsole.log(restOfItems); \/\/ Outputs: &#x5B;20, 30, 40]\n<\/pre><\/div>\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"3_Destructuring_Object_Properties\"><\/span>3. Destructuring Object Properties:<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>It can also be used in collecting all remaining own enumerable property keys that are not already picked off by the destructuring pattern.<\/p>\n\n\n\n<p>Example 1:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nconst { a, ...rest } = { a: 1, b: 2, c: 3 }; \/\/ rest = { b: 2, c: 3 }\n<\/pre><\/div>\n\n\n<p>Example 2:<\/p>\n\n\n<div class=\"wp-block-syntaxhighlighter-code \"><pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\nconst { firstItem, ...restOfItems } = { firstItem: &#039;apple&#039;, secondItem: &#039;banana&#039;, thirdItem: &#039;cherry&#039; };\nconsole.log(firstItem); \/\/ Outputs: &#039;apple&#039;\nconsole.log(restOfItems); \/\/ Outputs: { secondItem: &#039;banana&#039;, thirdItem: &#039;cherry&#039; }\n<\/pre><\/div>","protected":false},"excerpt":{"rendered":"<p>In JavaScript, the three dots (&#8230;) serve as two distinct operators depending on their context. These operators add to the flexibility and expressiveness of JavaScript, making the manipulation of arrays, objects, and function arguments more succinct and intuitive, they both utilize the same ellipsis syntax, but their functions are quite different. Read What Does \u2018$\u2019 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1120,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_uag_custom_page_level_css":"","footnotes":""},"categories":[7],"tags":[],"blocksy_meta":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>What Do The Three Dots (...) Mean in JavaScript? - SEOStudio<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"What Do The Three Dots (...) Mean in JavaScript? - SEOStudio\" \/>\n<meta property=\"og:description\" content=\"In JavaScript, the three dots (&#8230;) serve as two distinct operators depending on their context. These operators add to the flexibility and expressiveness of JavaScript, making the manipulation of arrays, objects, and function arguments more succinct and intuitive, they both utilize the same ellipsis syntax, but their functions are quite different. Read What Does \u2018$\u2019 [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/\" \/>\n<meta property=\"og:site_name\" content=\"SEOStudio\" \/>\n<meta property=\"article:published_time\" content=\"2023-11-05T09:03:04+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-11-05T09:07:47+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"800\" \/>\n\t<meta property=\"og:image:height\" content=\"470\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Awab Alzubair\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Awab Alzubair\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/\"},\"author\":{\"name\":\"Awab Alzubair\",\"@id\":\"https:\/\/seostudio.tools\/blog\/#\/schema\/person\/878a1a661d0941bd164750e536b7b19e\"},\"headline\":\"What Do The Three Dots (&#8230;) Mean in JavaScript?\",\"datePublished\":\"2023-11-05T09:03:04+00:00\",\"dateModified\":\"2023-11-05T09:07:47+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/\"},\"wordCount\":319,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/seostudio.tools\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg\",\"articleSection\":[\"Web Development\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/\",\"url\":\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/\",\"name\":\"What Do The Three Dots (...) Mean in JavaScript? - SEOStudio\",\"isPartOf\":{\"@id\":\"https:\/\/seostudio.tools\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg\",\"datePublished\":\"2023-11-05T09:03:04+00:00\",\"dateModified\":\"2023-11-05T09:07:47+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#primaryimage\",\"url\":\"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg\",\"contentUrl\":\"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg\",\"width\":800,\"height\":470,\"caption\":\"What do the 3 dots (...) mean in JavaScript\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/seostudio.tools\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"What Do The Three Dots (&#8230;) Mean in JavaScript?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/seostudio.tools\/blog\/#website\",\"url\":\"https:\/\/seostudio.tools\/blog\/\",\"name\":\"SEOStudio\",\"description\":\"SEOStudio Blog\",\"publisher\":{\"@id\":\"https:\/\/seostudio.tools\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/seostudio.tools\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/seostudio.tools\/blog\/#organization\",\"name\":\"SEOStudio\",\"url\":\"https:\/\/seostudio.tools\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/seostudio.tools\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/08\/normal-logo.png\",\"contentUrl\":\"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/08\/normal-logo.png\",\"width\":200,\"height\":51,\"caption\":\"SEOStudio\"},\"image\":{\"@id\":\"https:\/\/seostudio.tools\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/seostudio.tools\/blog\/#\/schema\/person\/878a1a661d0941bd164750e536b7b19e\",\"name\":\"Awab Alzubair\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/seostudio.tools\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/559ec97c2ddd64c458cc91d199fe7f5b?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/559ec97c2ddd64c458cc91d199fe7f5b?s=96&d=mm&r=g\",\"caption\":\"Awab Alzubair\"},\"sameAs\":[\"https:\/\/seostudio.tools\/blog\"],\"url\":\"https:\/\/seostudio.tools\/blog\/author\/awab\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"What Do The Three Dots (...) Mean in JavaScript? - SEOStudio","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/","og_locale":"en_US","og_type":"article","og_title":"What Do The Three Dots (...) Mean in JavaScript? - SEOStudio","og_description":"In JavaScript, the three dots (&#8230;) serve as two distinct operators depending on their context. These operators add to the flexibility and expressiveness of JavaScript, making the manipulation of arrays, objects, and function arguments more succinct and intuitive, they both utilize the same ellipsis syntax, but their functions are quite different. Read What Does \u2018$\u2019 [&hellip;]","og_url":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/","og_site_name":"SEOStudio","article_published_time":"2023-11-05T09:03:04+00:00","article_modified_time":"2023-11-05T09:07:47+00:00","og_image":[{"width":800,"height":470,"url":"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg","type":"image\/jpeg"}],"author":"Awab Alzubair","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Awab Alzubair","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#article","isPartOf":{"@id":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/"},"author":{"name":"Awab Alzubair","@id":"https:\/\/seostudio.tools\/blog\/#\/schema\/person\/878a1a661d0941bd164750e536b7b19e"},"headline":"What Do The Three Dots (&#8230;) Mean in JavaScript?","datePublished":"2023-11-05T09:03:04+00:00","dateModified":"2023-11-05T09:07:47+00:00","mainEntityOfPage":{"@id":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/"},"wordCount":319,"commentCount":0,"publisher":{"@id":"https:\/\/seostudio.tools\/blog\/#organization"},"image":{"@id":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#primaryimage"},"thumbnailUrl":"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg","articleSection":["Web Development"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/","url":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/","name":"What Do The Three Dots (...) Mean in JavaScript? - SEOStudio","isPartOf":{"@id":"https:\/\/seostudio.tools\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#primaryimage"},"image":{"@id":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#primaryimage"},"thumbnailUrl":"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg","datePublished":"2023-11-05T09:03:04+00:00","dateModified":"2023-11-05T09:07:47+00:00","breadcrumb":{"@id":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#primaryimage","url":"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg","contentUrl":"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg","width":800,"height":470,"caption":"What do the 3 dots (...) mean in JavaScript"},{"@type":"BreadcrumbList","@id":"https:\/\/seostudio.tools\/blog\/three-dots-in-javascript\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/seostudio.tools\/blog\/"},{"@type":"ListItem","position":2,"name":"What Do The Three Dots (&#8230;) Mean in JavaScript?"}]},{"@type":"WebSite","@id":"https:\/\/seostudio.tools\/blog\/#website","url":"https:\/\/seostudio.tools\/blog\/","name":"SEOStudio","description":"SEOStudio Blog","publisher":{"@id":"https:\/\/seostudio.tools\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/seostudio.tools\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/seostudio.tools\/blog\/#organization","name":"SEOStudio","url":"https:\/\/seostudio.tools\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/seostudio.tools\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/08\/normal-logo.png","contentUrl":"https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/08\/normal-logo.png","width":200,"height":51,"caption":"SEOStudio"},"image":{"@id":"https:\/\/seostudio.tools\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/seostudio.tools\/blog\/#\/schema\/person\/878a1a661d0941bd164750e536b7b19e","name":"Awab Alzubair","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/seostudio.tools\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/559ec97c2ddd64c458cc91d199fe7f5b?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/559ec97c2ddd64c458cc91d199fe7f5b?s=96&d=mm&r=g","caption":"Awab Alzubair"},"sameAs":["https:\/\/seostudio.tools\/blog"],"url":"https:\/\/seostudio.tools\/blog\/author\/awab\/"}]}},"uagb_featured_image_src":{"full":["https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg",800,470,false],"thumbnail":["https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript-150x150.jpg",150,150,true],"medium":["https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript-300x176.jpg",300,176,true],"medium_large":["https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript-768x451.jpg",768,451,true],"large":["https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg",800,470,false],"1536x1536":["https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg",800,470,false],"2048x2048":["https:\/\/seostudio.tools\/blog\/wp-content\/uploads\/2023\/11\/What-do-the-3-dots-.-mean-in-JavaScript.jpg",800,470,false]},"uagb_author_info":{"display_name":"Awab Alzubair","author_link":"https:\/\/seostudio.tools\/blog\/author\/awab\/"},"uagb_comment_info":0,"uagb_excerpt":"In JavaScript, the three dots (&#8230;) serve as two distinct operators depending on their context. These operators add to the flexibility and expressiveness of JavaScript, making the manipulation of arrays, objects, and function arguments more succinct and intuitive, they both utilize the same ellipsis syntax, but their functions are quite different. Read What Does \u2018$\u2019&hellip;","_links":{"self":[{"href":"https:\/\/seostudio.tools\/blog\/wp-json\/wp\/v2\/posts\/1097"}],"collection":[{"href":"https:\/\/seostudio.tools\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/seostudio.tools\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/seostudio.tools\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/seostudio.tools\/blog\/wp-json\/wp\/v2\/comments?post=1097"}],"version-history":[{"count":24,"href":"https:\/\/seostudio.tools\/blog\/wp-json\/wp\/v2\/posts\/1097\/revisions"}],"predecessor-version":[{"id":1506,"href":"https:\/\/seostudio.tools\/blog\/wp-json\/wp\/v2\/posts\/1097\/revisions\/1506"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/seostudio.tools\/blog\/wp-json\/wp\/v2\/media\/1120"}],"wp:attachment":[{"href":"https:\/\/seostudio.tools\/blog\/wp-json\/wp\/v2\/media?parent=1097"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/seostudio.tools\/blog\/wp-json\/wp\/v2\/categories?post=1097"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/seostudio.tools\/blog\/wp-json\/wp\/v2\/tags?post=1097"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}