{"pageProps":{"post":{"filepath":"content/blog/como-gerar-um-array-populado-em-javascript/index.md","slug":"como-gerar-um-array-populado-em-javascript","url":"/como-gerar-um-array-populado-em-javascript","hash":"ff12afa89fbc7f6e6eb4d728674c1a6cc0bfa2a0928f9decbaebac00a3746d5b2796b7645d879522aac6a011076bec36969e169b7c489224a1bda33a7ae041ee","content":"\nÉ muito comum durante a solução de alguns problems com algorítmos de precisarmos de um array com valores padrão já inseridos.\n\nInclusive para gerar dados de testes. E podemos gerar o array com os mais diversos valores, como números, strings e até mesmo objetos.\n\n## O bom e velho `for`\n\nA forma mais tradicional de fazer esta tarefa é utilizar o bom e velho `for`. Sem muitos segredos, podemos fazer o seguinte:\n\n```javascript\nconst array = []\nconst size = 10\nfor (let i = 0; i < size; i++) {\n array.push(i)\n}\n// array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]\n```\n\nDesta maneira podemos inclusive criar valores diferentes de inteiros, por exemplo:\n\n```javascript\nconst names = []\nconst size = 7\nfor (let i = 0; i < size; i++) {\n names.push({\n id: i,\n name: `Name ${i}`\n })\n}\n/*\nnames = \n 0: {id: 0, name: \"Name 0\"}\n 1: {id: 1, name: \"Name 1\"}\n 2: {id: 2, name: \"Name 2\"}\n 3: {id: 3, name: \"Name 3\"}\n 4: {id: 4, name: \"Name 4\"}\n 5: {id: 5, name: \"Name 5\"}\n 6: {id: 6, name: \"Name 6\"}\n*/\n```\n\nUma versão alternativa:\n\n```javascript\nconst size = 7\nconst names = new Array(size)\n\nfor (let i = 0; i < size; i++) {\n names[i] = {\n id: i,\n name: `Name ${i}`\n }\n}\n/*\nnames = \n 0: {id: 0, name: \"Name 0\"}\n 1: {id: 1, name: \"Name 1\"}\n 2: {id: 2, name: \"Name 2\"}\n 3: {id: 3, name: \"Name 3\"}\n 4: {id: 4, name: \"Name 4\"}\n 5: {id: 5, name: \"Name 5\"}\n 6: {id: 6, name: \"Name 6\"}\n*/\n```\n\n## Array.fill\n\nOutra forma de gerar o array com valores é utilizando o `Array.fill`. Nesta forma, criamos um array com o tamanho desejado e informamos o valor para qual queremos preenchê-lo.\n\n```javascript\nconst array = new Array(15).fill('valor')\n// array = [\"valor\", \"valor\", \"valor\", \"valor\", \"valor\", \"valor\", \"valor\", \"valor\", \"valor\", \"valor\", \"valor\", \"valor\", \"valor\", \"valor\", \"valor\"]\n```\n\nUma observação importante é que o método `fill` usa a mesma referência. Ou seja, se passarmos um objeto como valor no fill, todos os itens do vetor referenciarão o mesmo objeto. E caso alteramos um deles, iremos alterar todos.\n\n```javascript\nconst people = new Array(3).fill({ name: 'Person' })\npeople[0].name = 'Changed Person'\n/*\npeople = \n 0: {name: \"Changed Person\"}\n 1: {name: \"Changed Person\"}\n 2: {name: \"Changed Person\"}\n*/\n```\n\nExiste uma forma de mudar ligeiramente este comportamento, bastando para isso conectar o `fill` com um `map` (lembrando que `map` transforma um vetor em outro).\n\n```javascript\nconst people = new Array(3).fill(null).map(() => ({ name: 'Person' }))\npeople[0].name = 'Changed Person'\n/*\npeople = \n 0: {name: \"Changed Person\"}\n 1: {name: \"Person\"}\n 2: {name: \"Person\"}\n*/\n```\n\n# Array.from\n\nUma outra forma de criar um array é usando o `Array.from`. Esta versão é bastante simples:\n\n```javascript\nconst array = Array.from({ length: 5 }, () => 1)\n// array = [1, 1, 1, 1, 1]\nconst people = Array.from({ length: 3 }, () => ({ name: 'Person' }))\n/*\npeople = \n 0: {name: \"Person\"}\n 1: {name: \"Person\"}\n 2: {name: \"Person\"}\n*/\n```\n\n## Usando o `Object.keys`\n\nUma forma bastante interessante de gerar um array preenchido com números é usando uma característica de objetos (sim, objetos). Usaremos o `Object.keys`.\n\n```javascript\nconst numbers = Object.keys(new Array(5).fill(null))\n// numbers = [\"0\", \"1\", \"2\", \"3\", \"4\"]\n```\n\nRepare que os números que foram inseridos no array estão com `string`. Podemos usar um map para convertê-los:\n\n```javascript\nconst numbers = Object.keys(new Array(5).fill(null)).map(Number)\n// numbers = [0, 1, 2, 3, 4]\n```\n\nBom é isso :) O que gostou destas formas de gerar um vetor? Qual a sua forma favorita?\n\nAh, todos os nossos cursos tem um módulos somente de Javascript ;) Conheça o [Fullstack Master](https://go.devpleno.com/fsm?sck=blog-como-gerar-um-array-populado-em-javascript)\n","frontMatter":{"title":"4 formas de gerar um array (vetor) populado em Javascript","date":"2021-07-25","tags":["Javascript"],"thumbnail":"array-javascript.jpg","author":"Tulio Faria"},"mdx":{"compiledSource":"\"use strict\";\n\nvar _excluded = [\"components\"];\n\nfunction _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n/* @jsxRuntime classic */\n\n/* @jsx mdx */\nvar layoutProps = {};\nvar MDXLayout = \"wrapper\";\n\nfunction MDXContent(_ref) {\n var components = _ref.components,\n props = _objectWithoutProperties(_ref, _excluded);\n\n return mdx(MDXLayout, _extends({}, layoutProps, props, {\n components: components,\n mdxType: \"MDXLayout\"\n }), mdx(\"p\", null, \"\\xC9 muito comum durante a solu\\xE7\\xE3o de alguns problems com algor\\xEDtmos de precisarmos de um array com valores padr\\xE3o j\\xE1 inseridos.\"), mdx(\"p\", null, \"Inclusive para gerar dados de testes. E podemos gerar o array com os mais diversos valores, como n\\xFAmeros, strings e at\\xE9 mesmo objetos.\"), mdx(\"h2\", null, \"O bom e velho \", mdx(\"inlineCode\", {\n parentName: \"h2\"\n }, \"for\")), mdx(\"p\", null, \"A forma mais tradicional de fazer esta tarefa \\xE9 utilizar o bom e velho \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"for\"), \". Sem muitos segredos, podemos fazer o seguinte:\"), mdx(\"pre\", {\n \"className\": \"language-javascript\"\n }, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-javascript\"\n }, mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" array \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"[\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"]\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" size \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"10\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword control-flow\"\n }, \"for\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"let\"), \" i \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"0\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \";\"), \" i \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"<\"), \" size\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \";\"), \" i\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"++\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"{\"), \"\\n array\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token method function property-access\"\n }, \"push\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), \"i\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"}\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token comment\"\n }, \"// array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]\"), \"\\n\")), mdx(\"p\", null, \"Desta maneira podemos inclusive criar valores diferentes de inteiros, por exemplo:\"), mdx(\"pre\", {\n \"className\": \"language-javascript\"\n }, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-javascript\"\n }, mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" names \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"[\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"]\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" size \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"7\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword control-flow\"\n }, \"for\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"let\"), \" i \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"0\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \";\"), \" i \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"<\"), \" size\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \";\"), \" i\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"++\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"{\"), \"\\n names\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token method function property-access\"\n }, \"push\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"{\"), \"\\n id\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \":\"), \" i\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \",\"), \"\\n name\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \":\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token template-string\"\n }, mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token template-punctuation string\"\n }, \"`\"), mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token string\"\n }, \"Name \"), mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token interpolation\"\n }, mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token interpolation-punctuation punctuation\"\n }, \"${\"), \"i\", mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token interpolation-punctuation punctuation\"\n }, \"}\")), mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token template-punctuation string\"\n }, \"`\")), \"\\n \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"}\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"}\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token comment\"\n }, \"/*\\nnames = \\n 0: {id: 0, name: \\\"Name 0\\\"}\\n 1: {id: 1, name: \\\"Name 1\\\"}\\n 2: {id: 2, name: \\\"Name 2\\\"}\\n 3: {id: 3, name: \\\"Name 3\\\"}\\n 4: {id: 4, name: \\\"Name 4\\\"}\\n 5: {id: 5, name: \\\"Name 5\\\"}\\n 6: {id: 6, name: \\\"Name 6\\\"}\\n*/\"), \"\\n\")), mdx(\"p\", null, \"Uma vers\\xE3o alternativa:\"), mdx(\"pre\", {\n \"className\": \"language-javascript\"\n }, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-javascript\"\n }, mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" size \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"7\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" names \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"new\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token class-name\"\n }, \"Array\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), \"size\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \"\\n\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword control-flow\"\n }, \"for\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"let\"), \" i \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"0\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \";\"), \" i \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"<\"), \" size\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \";\"), \" i\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"++\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"{\"), \"\\n names\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"[\"), \"i\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"]\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"{\"), \"\\n id\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \":\"), \" i\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \",\"), \"\\n name\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \":\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token template-string\"\n }, mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token template-punctuation string\"\n }, \"`\"), mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token string\"\n }, \"Name \"), mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token interpolation\"\n }, mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token interpolation-punctuation punctuation\"\n }, \"${\"), \"i\", mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token interpolation-punctuation punctuation\"\n }, \"}\")), mdx(\"span\", {\n parentName: \"span\",\n \"className\": \"token template-punctuation string\"\n }, \"`\")), \"\\n \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"}\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"}\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token comment\"\n }, \"/*\\nnames = \\n 0: {id: 0, name: \\\"Name 0\\\"}\\n 1: {id: 1, name: \\\"Name 1\\\"}\\n 2: {id: 2, name: \\\"Name 2\\\"}\\n 3: {id: 3, name: \\\"Name 3\\\"}\\n 4: {id: 4, name: \\\"Name 4\\\"}\\n 5: {id: 5, name: \\\"Name 5\\\"}\\n 6: {id: 6, name: \\\"Name 6\\\"}\\n*/\"), \"\\n\")), mdx(\"h2\", null, \"Array.fill\"), mdx(\"p\", null, \"Outra forma de gerar o array com valores \\xE9 utilizando o \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"Array.fill\"), \". Nesta forma, criamos um array com o tamanho desejado e informamos o valor para qual queremos preench\\xEA-lo.\"), mdx(\"pre\", {\n \"className\": \"language-javascript\"\n }, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-javascript\"\n }, mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" array \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"new\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token class-name\"\n }, \"Array\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"15\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token method function property-access\"\n }, \"fill\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token string\"\n }, \"'valor'\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token comment\"\n }, \"// array = [\\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\", \\\"valor\\\"]\"), \"\\n\")), mdx(\"p\", null, \"Uma observa\\xE7\\xE3o importante \\xE9 que o m\\xE9todo \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"fill\"), \" usa a mesma refer\\xEAncia. Ou seja, se passarmos um objeto como valor no fill, todos os itens do vetor referenciar\\xE3o o mesmo objeto. E caso alteramos um deles, iremos alterar todos.\"), mdx(\"pre\", {\n \"className\": \"language-javascript\"\n }, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-javascript\"\n }, mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" people \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"new\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token class-name\"\n }, \"Array\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"3\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token method function property-access\"\n }, \"fill\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"{\"), \" name\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \":\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token string\"\n }, \"'Person'\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"}\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \"\\npeople\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"[\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"0\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"]\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token property-access\"\n }, \"name\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token string\"\n }, \"'Changed Person'\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token comment\"\n }, \"/*\\npeople = \\n 0: {name: \\\"Changed Person\\\"}\\n 1: {name: \\\"Changed Person\\\"}\\n 2: {name: \\\"Changed Person\\\"}\\n*/\"), \"\\n\")), mdx(\"p\", null, \"Existe uma forma de mudar ligeiramente este comportamento, bastando para isso conectar o \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"fill\"), \" com um \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"map\"), \" (lembrando que \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"map\"), \" transforma um vetor em outro).\"), mdx(\"pre\", {\n \"className\": \"language-javascript\"\n }, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-javascript\"\n }, mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" people \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"new\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token class-name\"\n }, \"Array\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"3\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token method function property-access\"\n }, \"fill\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword null nil\"\n }, \"null\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token method function property-access\"\n }, \"map\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token arrow operator\"\n }, \"=>\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"{\"), \" name\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \":\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token string\"\n }, \"'Person'\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"}\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \"\\npeople\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"[\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"0\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"]\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token property-access\"\n }, \"name\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token string\"\n }, \"'Changed Person'\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token comment\"\n }, \"/*\\npeople = \\n 0: {name: \\\"Changed Person\\\"}\\n 1: {name: \\\"Person\\\"}\\n 2: {name: \\\"Person\\\"}\\n*/\"), \"\\n\")), mdx(\"h1\", null, \"Array.from\"), mdx(\"p\", null, \"Uma outra forma de criar um array \\xE9 usando o \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"Array.from\"), \". Esta vers\\xE3o \\xE9 bastante simples:\"), mdx(\"pre\", {\n \"className\": \"language-javascript\"\n }, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-javascript\"\n }, mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" array \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token known-class-name class-name\"\n }, \"Array\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword module\"\n }, \"from\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"{\"), \" length\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \":\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"5\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"}\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \",\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token arrow operator\"\n }, \"=>\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"1\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token comment\"\n }, \"// array = [1, 1, 1, 1, 1]\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" people \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token known-class-name class-name\"\n }, \"Array\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword module\"\n }, \"from\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"{\"), \" length\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \":\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"3\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"}\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \",\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token arrow operator\"\n }, \"=>\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"{\"), \" name\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \":\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token string\"\n }, \"'Person'\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"}\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token comment\"\n }, \"/*\\npeople = \\n 0: {name: \\\"Person\\\"}\\n 1: {name: \\\"Person\\\"}\\n 2: {name: \\\"Person\\\"}\\n*/\"), \"\\n\")), mdx(\"h2\", null, \"Usando o \", mdx(\"inlineCode\", {\n parentName: \"h2\"\n }, \"Object.keys\")), mdx(\"p\", null, \"Uma forma bastante interessante de gerar um array preenchido com n\\xFAmeros \\xE9 usando uma caracter\\xEDstica de objetos (sim, objetos). Usaremos o \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"Object.keys\"), \".\"), mdx(\"pre\", {\n \"className\": \"language-javascript\"\n }, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-javascript\"\n }, mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" numbers \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token known-class-name class-name\"\n }, \"Object\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token method function property-access\"\n }, \"keys\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"new\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token class-name\"\n }, \"Array\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"5\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token method function property-access\"\n }, \"fill\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword null nil\"\n }, \"null\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token comment\"\n }, \"// numbers = [\\\"0\\\", \\\"1\\\", \\\"2\\\", \\\"3\\\", \\\"4\\\"]\"), \"\\n\")), mdx(\"p\", null, \"Repare que os n\\xFAmeros que foram inseridos no array est\\xE3o com \", mdx(\"inlineCode\", {\n parentName: \"p\"\n }, \"string\"), \". Podemos usar um map para convert\\xEA-los:\"), mdx(\"pre\", {\n \"className\": \"language-javascript\"\n }, mdx(\"code\", {\n parentName: \"pre\",\n \"className\": \"language-javascript\"\n }, mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"const\"), \" numbers \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token operator\"\n }, \"=\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token known-class-name class-name\"\n }, \"Object\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token method function property-access\"\n }, \"keys\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword\"\n }, \"new\"), \" \", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token class-name\"\n }, \"Array\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token number\"\n }, \"5\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token method function property-access\"\n }, \"fill\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token keyword null nil\"\n }, \"null\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \".\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token method function property-access\"\n }, \"map\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \"(\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token known-class-name class-name\"\n }, \"Number\"), mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token punctuation\"\n }, \")\"), \"\\n\", mdx(\"span\", {\n parentName: \"code\",\n \"className\": \"token comment\"\n }, \"// numbers = [0, 1, 2, 3, 4]\"), \"\\n\")), mdx(\"p\", null, \"Bom \\xE9 isso :) O que gostou destas formas de gerar um vetor? Qual a sua forma favorita?\"), mdx(\"p\", null, \"Ah, todos os nossos cursos tem um m\\xF3dulos somente de Javascript ;) Conhe\\xE7a o \", mdx(\"a\", {\n parentName: \"p\",\n \"href\": \"https://go.devpleno.com/fsm?sck=blog-como-gerar-um-array-populado-em-javascript\"\n }, \"Fullstack Master\")));\n}\n\n;\nMDXContent.isMDXComponent = true;","renderedOutput":"
É muito comum durante a solução de alguns problems com algorítmos de precisarmos de um array com valores padrão já inseridos.
Inclusive para gerar dados de testes. E podemos gerar o array com os mais diversos valores, como números, strings e até mesmo objetos.

O bom e velho for

A forma mais tradicional de fazer esta tarefa é utilizar o bom e velho for. Sem muitos segredos, podemos fazer o seguinte:
const array = []\nconst size = 10\nfor (let i = 0; i < size; i++) {\n  array.push(i)\n}\n// array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]\n
Desta maneira podemos inclusive criar valores diferentes de inteiros, por exemplo:
const names = []\nconst size = 7\nfor (let i = 0; i < size; i++) {\n  names.push({\n    id: i,\n    name: `Name ${i}`\n  })\n}\n/*\nnames = \n    0: {id: 0, name: "Name 0"}\n    1: {id: 1, name: "Name 1"}\n    2: {id: 2, name: "Name 2"}\n    3: {id: 3, name: "Name 3"}\n    4: {id: 4, name: "Name 4"}\n    5: {id: 5, name: "Name 5"}\n    6: {id: 6, name: "Name 6"}\n*/\n
Uma versão alternativa:
const size = 7\nconst names = new Array(size)\n\nfor (let i = 0; i < size; i++) {\n  names[i] = {\n    id: i,\n    name: `Name ${i}`\n  }\n}\n/*\nnames = \n    0: {id: 0, name: "Name 0"}\n    1: {id: 1, name: "Name 1"}\n    2: {id: 2, name: "Name 2"}\n    3: {id: 3, name: "Name 3"}\n    4: {id: 4, name: "Name 4"}\n    5: {id: 5, name: "Name 5"}\n    6: {id: 6, name: "Name 6"}\n*/\n

Array.fill

Outra forma de gerar o array com valores é utilizando o Array.fill. Nesta forma, criamos um array com o tamanho desejado e informamos o valor para qual queremos preenchê-lo.
const array = new Array(15).fill('valor')\n// array = ["valor", "valor", "valor", "valor", "valor", "valor", "valor", "valor", "valor", "valor", "valor", "valor", "valor", "valor", "valor"]\n
Uma observação importante é que o método fill usa a mesma referência. Ou seja, se passarmos um objeto como valor no fill, todos os itens do vetor referenciarão o mesmo objeto. E caso alteramos um deles, iremos alterar todos.
const people = new Array(3).fill({ name: 'Person' })\npeople[0].name = 'Changed Person'\n/*\npeople = \n  0: {name: "Changed Person"}\n  1: {name: "Changed Person"}\n  2: {name: "Changed Person"}\n*/\n
Existe uma forma de mudar ligeiramente este comportamento, bastando para isso conectar o fill com um map (lembrando que map transforma um vetor em outro).
const people = new Array(3).fill(null).map(() => ({ name: 'Person' }))\npeople[0].name = 'Changed Person'\n/*\npeople = \n  0: {name: "Changed Person"}\n  1: {name: "Person"}\n  2: {name: "Person"}\n*/\n

Array.from

Uma outra forma de criar um array é usando o Array.from. Esta versão é bastante simples:
const array = Array.from({ length: 5 }, () => 1)\n// array = [1, 1, 1, 1, 1]\nconst people = Array.from({ length: 3 }, () => ({ name: 'Person' }))\n/*\npeople = \n  0: {name: "Person"}\n  1: {name: "Person"}\n  2: {name: "Person"}\n*/\n

Usando o Object.keys

Uma forma bastante interessante de gerar um array preenchido com números é usando uma característica de objetos (sim, objetos). Usaremos o Object.keys.
const numbers = Object.keys(new Array(5).fill(null))\n// numbers = ["0", "1", "2", "3", "4"]\n
Repare que os números que foram inseridos no array estão com string. Podemos usar um map para convertê-los:
const numbers = Object.keys(new Array(5).fill(null)).map(Number)\n// numbers = [0, 1, 2, 3, 4]\n
Bom é isso :) O que gostou destas formas de gerar um vetor? Qual a sua forma favorita?
Ah, todos os nossos cursos tem um módulos somente de Javascript ;) Conheça o Fullstack Master
","scope":{"title":"4 formas de gerar um array (vetor) populado em Javascript","date":"2021-07-25","tags":["Javascript"],"thumbnail":"array-javascript.jpg","author":"Tulio Faria"}},"relationships":{"author":[null]}},"latestPosts":[{"filepath":"content/blog/lista-definitiva-de-sites-para-progradores-remotos/index.md","slug":"lista-definitiva-de-sites-para-progradores-remotos","url":"/lista-definitiva-de-sites-para-progradores-remotos","hash":"c1dca04ba8bf11b3cd6caa1a8e2ec0b80edaa20dc310d8379c5221234250a8136e1f6ca0d79abc645c02c7910618fd3b9d1f62c9982891e43952fbde1f7cae1d","frontMatter":{"title":"Lista de sites para trabalhar remotamente como programador em 2022","date":"2021-09-05","tags":["Carreira"],"thumbnail":"lista-trabalho-remoto.jpg","author":"Tulio Faria"},"mdx":{"compiledSource":"","renderedOutput":""},"relationships":{"author":[null]},"excerpt":"\nSe tem uma profissão que já se beneficiava dos benefícios de trabalhar remotamente bem antes de virar moda é a de programador. Eu mesmo atuo neste modelo a bastante tempo.\n\nA pergunta que mais recebo é: quais os melhores sites para trabalhar remotamente como programador?\n\nNeste artigo vamos explora...","datePtBR":"5 de setembro de 2021"},{"filepath":"content/blog/como-gerar-um-array-populado-em-javascript/index.md","slug":"como-gerar-um-array-populado-em-javascript","url":"/como-gerar-um-array-populado-em-javascript","hash":"ff12afa89fbc7f6e6eb4d728674c1a6cc0bfa2a0928f9decbaebac00a3746d5b2796b7645d879522aac6a011076bec36969e169b7c489224a1bda33a7ae041ee","frontMatter":{"title":"4 formas de gerar um array (vetor) populado em Javascript","date":"2021-07-25","tags":["Javascript"],"thumbnail":"array-javascript.jpg","author":"Tulio Faria"},"mdx":{"compiledSource":"","renderedOutput":""},"relationships":{"author":[null]},"excerpt":"\nÉ muito comum durante a solução de alguns problems com algorítmos de precisarmos de um array com valores padrão já inseridos.\n\nInclusive para gerar dados de testes. E podemos gerar o array com os mais diversos valores, como números, strings e até mesmo objetos.\n\n## O bom e velho `for`\n\nA forma mais...","datePtBR":"25 de julho de 2021"},{"filepath":"content/blog/a-habilidade-mais-importante-que-um-programador-deveria-ter-e-praticar/index.md","slug":"a-habilidade-mais-importante-que-um-programador-deveria-ter-e-praticar","url":"/a-habilidade-mais-importante-que-um-programador-deveria-ter-e-praticar","hash":"1c5a9e7d1d3184a671ca83ad473e995a394714d3b2cd48f4b238cb63da57ac5df67515aacabbea4eb63fe1674c58863b2a17df259c05fd275b77b84323093a59","frontMatter":{"title":"A habilidade mais importante que um programador deveria ter (e praticar)","date":"2021-05-13","tags":["Carreira"],"thumbnail":"perguntas-thumb.jpg","author":"Tulio Faria"},"mdx":{"compiledSource":"","renderedOutput":""},"relationships":{"author":[null]},"excerpt":"\nÉ muito comum na área de programação todos pensarem que a habilidade mais importante esteja relacionada ao pensamento lógico e a capacidade de resolver problemas. E não que estas habilidades não sejam importantes, mas existe uma habilidade que potencializa o resultados delas: **perguntar**.\n\nSim, e...","datePtBR":"13 de maio de 2021"},{"filepath":"content/blog/como-as-maratonas-de-programacao-da-faculdade-impactaram-a-minha-carreira/index.md","slug":"como-as-maratonas-de-programacao-da-faculdade-impactaram-a-minha-carreira","url":"/como-as-maratonas-de-programacao-da-faculdade-impactaram-a-minha-carreira","hash":"16fb34bb4fcef4ecd5e8c9ea267c81be8e5b1bfb506bf0f705b1be4bdfb8595020f896a39d392280d8b1a7865d55d624033e26c7d526fb527ed693fa87052b8b","frontMatter":{"title":"Como as maratonas de programação da faculdade impactaram a minha carreira","date":"2019-03-19","tags":["Carreira"],"thumbnail":"top-tal-790x400.png","author":"Tulio Faria"},"mdx":{"compiledSource":"","renderedOutput":""},"relationships":{"author":[null]},"excerpt":"\nA história do post de hoje já tem mais de 10 anos e faz parte de lembranças que eu tenho de quando ainda estava na faculdade, mais precisamente, de quando participava das maratonas de programação, onde me graduei. E fique comigo até o fim, pois a lição aqui não é só baseada nos prêmios e competição...","datePtBR":"19 de março de 2019"}]},"__N_SSG":true}