{"id":809,"date":"2018-10-01T00:56:17","date_gmt":"2018-10-01T00:56:17","guid":{"rendered":"https:\/\/blog.hassler.ec\/wp\/?p=809"},"modified":"2018-09-26T01:00:15","modified_gmt":"2018-09-26T01:00:15","slug":"these-javascript-methods-will-boost-your-skills-in-just-a-few-minutes","status":"publish","type":"post","link":"https:\/\/blog.hassler.ec\/wp\/2018\/10\/01\/these-javascript-methods-will-boost-your-skills-in-just-a-few-minutes\/","title":{"rendered":"These JavaScript methods will boost your skills in just a few\u00a0minutes"},"content":{"rendered":"
\n
\n
\n
\n
\"Bilderesultat<\/div>\n<\/figure>\n

Most of the applications we build today require some sort of data collection modification. Processing items in a collection is a common operation you will most likely encounter. Forget the conventional way of doing\u00a0for-loop<\/code>\u00a0like\u00a0(let i=0; i < value.length; i++ )<\/code>.<\/p>\n

Quick heads-up, using\u00a0const<\/code>\u00a0in\u00a0for-loop<\/code>\u00a0will give you an error. Reason why is because it re-declares the value during each execution hence\u00a0i<\/code>\u00a0is modified by\u00a0i++<\/code>. So whenever you think of either using\u00a0const<\/code>\u00a0or\u00a0let<\/code>, ask yourself\u200a\u2014\u200aWill this value be re-declared? If the answer is\u00a0yes<\/strong>, go for\u00a0let<\/code>\u00a0, and if\u00a0no<\/strong>, go for\u00a0const<\/code>.\u00a0More info<\/a>.<\/p><\/blockquote>\n

Let\u2019s say you want to show list of products and categorize, filter, search, modify or update a collection. Or maybe you want to perform quick calculations such as sum, multiplication, and so forth. What is the optimal way to achieve this?<\/p>\n

Maybe you don\u2019t like\u00a0arrow functions<\/strong>, you don\u2019t want to spend too much time learning something new, or they\u2019re just not relevant for you. Don\u2019t worry, you are not alone. I\u2019ll show you how it is done in ES5 (functional deceleration) and ES6 (arrow functions).<\/p>\n

Be aware:<\/strong>\u00a0Arrow functions and function declarations \/ expressions are not equivalent and cannot be\u00a0replaced blindly<\/a>. Keep in mind that the\u00a0this<\/code>keyword works differently between the two.<\/p>\n

The methods we\u2019ll be looking\u00a0at:<\/h4>\n
    \n
  1. Spread operator<\/li>\n
  2. for\u2026of iterator<\/li>\n
  3. includes()<\/li>\n
  4. some()<\/li>\n
  5. every()<\/li>\n
  6. filter()<\/li>\n
  7. map()<\/li>\n
  8. reduce()<\/li>\n<\/ol>\n

    If you want to become a better web developer, start your own business, teach others, or improve your development skills, I\u2019ll be posting weekly tips and tricks on the latest web development languages.<\/span><\/p><\/blockquote>\n

    1. Spread\u00a0operator<\/h3>\n

    The Spread Operator\u00a0expands<\/strong>\u00a0an array into its elements. It can also be used for object literals.<\/p>\n

    Why should I use it?<\/strong><\/p>\n