<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>Forem: catch(js)</title>
    <description>The latest articles on Forem by catch(js) (@js_catch).</description>
    <link>https://forem.com/js_catch</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F419400%2F907c57a8-77b4-4dce-b768-3842b5329099.png</url>
      <title>Forem: catch(js)</title>
      <link>https://forem.com/js_catch</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/js_catch"/>
    <language>en</language>
    <item>
      <title>02 - Primitive and Non-Primitive Data Types in Javascript</title>
      <dc:creator>catch(js)</dc:creator>
      <pubDate>Thu, 02 Jul 2020 07:58:20 +0000</pubDate>
      <link>https://forem.com/js_catch/02-primitive-and-non-primitive-data-types-in-javascript-2dhd</link>
      <guid>https://forem.com/js_catch/02-primitive-and-non-primitive-data-types-in-javascript-2dhd</guid>
      <description>&lt;h3&gt;
  
  
  Data types in js is broadly classified into 2 types:
&lt;/h3&gt;

&lt;ol&gt;
&lt;li&gt;Primitive types :&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Type&lt;/th&gt;
&lt;th&gt;Description&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;string&lt;/td&gt;
&lt;td&gt;Used for denoting strings&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;number&lt;/td&gt;
&lt;td&gt;Used for denoting integers or floating-point&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;bigint&lt;/td&gt;
&lt;td&gt;Used for denoting whole numbers larger than 2&lt;sup&gt;53&lt;/sup&gt; - 1&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;boolean&lt;/td&gt;
&lt;td&gt;Used for denoting true or false&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;undefined&lt;/td&gt;
&lt;td&gt;Used for denoting an unassigned value&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;symbol&lt;/td&gt;
&lt;td&gt;Used for denoting unique identifiers&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;null&lt;/td&gt;
&lt;td&gt;Used for denoting an intentional absence of a value&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;ol&gt;
&lt;li&gt;Non-primitive types :&lt;/li&gt;
&lt;/ol&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Type&lt;/th&gt;
&lt;th&gt;Description&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;object&lt;/td&gt;
&lt;td&gt;Used for denoting complex data structure with a collection of properties and methods&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;pre&gt;All JavaScript values, except primitives, are objects.&lt;/pre&gt;




&lt;p&gt;&lt;strong&gt;Mutable values&lt;/strong&gt; are those which can be modified after creation&lt;br&gt;
&lt;strong&gt;Immutable values&lt;/strong&gt; are those which cannot be modified after creation&lt;/p&gt;

&lt;p&gt;So the fundamental difference between primitive and non-primitive is that primitive values are immutable and non-primitive values are mutable and Primitives are stored by value while Non-Primitive (objects) are stored by reference.&lt;/p&gt;

&lt;p&gt;It is important to note here that the variable in which the primitive value is stored can still be reassigned a new value as shown in Example 1, but the existing value can not be changed as shown in Example 2. A primitive value can be replaced, but it can't be directly altered.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Example 1&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;string&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;hello world&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;
&lt;span class="nx"&gt;string&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;this is a string&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;string&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="c1"&gt;// Output -&amp;gt; 'this is a string'&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;Example 2&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;string&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;this is a string&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;
&lt;span class="nx"&gt;string&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;T&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;string&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="c1"&gt;// Output -&amp;gt; 'this is a string.'&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;






&lt;h3&gt;
  
  
  How do primitive values such as strings have toUpperCase() method?
&lt;/h3&gt;

&lt;p&gt;There are many things one would want to do with primitive values(number, string, etc...) such as finding the length of string, converting a string to uppercase or lowercase, and many more...&lt;br&gt;
Thus Javascript allows us to work with Primitive as if they are objects. In order for that to work, a special “object wrapper” that provides the extra functionality is created because of which we can access those methods and then is destroyed after the work.&lt;/p&gt;

&lt;p&gt;Primitives except null and undefined provide many helpful methods&lt;br&gt;
The “object wrappers” are different for each primitive type and are called: String, Number, Boolean and Symbol. Thus, they provide different sets of methods.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Example 3&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;str&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;javascript&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt; &lt;span class="nx"&gt;str&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;toUpperCase&lt;/span&gt;&lt;span class="p"&gt;()&lt;/span&gt; &lt;span class="p"&gt;);&lt;/span&gt; &lt;span class="c1"&gt;// JAVASCRIPT&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;In Example 3 when we accessing its property, a special object is created which has useful methods, like toUpperCase().&lt;br&gt;
That method runs and returns a new string. After which&lt;br&gt;
the special object is destroyed, leaving the primitive str alone.&lt;/p&gt;
&lt;h3&gt;
  
  
  How are Non-primitive values mutable
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Example 4&lt;/strong&gt;&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;arr&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;one&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;two&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;three&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt; &lt;span class="p"&gt;];&lt;/span&gt;
&lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;]&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="s1"&gt;ONE&lt;/span&gt;&lt;span class="dl"&gt;'&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;arr&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="c1"&gt;// Output -&amp;gt; [ 'ONE', 'two', 'three' ] &lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;In example 4 we are mutating the state of variable &lt;code&gt;arr&lt;/code&gt; and changing the value itself as value at index 0 is changed from &lt;code&gt;one&lt;/code&gt; to &lt;code&gt;ONE&lt;/code&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  The typeof operator
&lt;/h2&gt;

&lt;p&gt;&lt;code&gt;typeof&lt;/code&gt; operator returns a string that tells the type of a JavaScript variable.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="k"&gt;typeof&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;hello&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; &lt;span class="c1"&gt;// "string"&lt;/span&gt;

&lt;span class="k"&gt;typeof&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt; &lt;span class="c1"&gt;// "number"&lt;/span&gt;

&lt;span class="k"&gt;typeof&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="nx"&gt;n&lt;/span&gt; &lt;span class="c1"&gt;// "bigint"&lt;/span&gt;

&lt;span class="k"&gt;typeof&lt;/span&gt; &lt;span class="kc"&gt;true&lt;/span&gt; &lt;span class="c1"&gt;// "boolean"&lt;/span&gt;

&lt;span class="k"&gt;typeof&lt;/span&gt; &lt;span class="kc"&gt;undefined&lt;/span&gt; &lt;span class="c1"&gt;// "undefined"&lt;/span&gt;

&lt;span class="k"&gt;typeof&lt;/span&gt; &lt;span class="nb"&gt;Symbol&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;id&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="c1"&gt;// "symbol"&lt;/span&gt;

&lt;span class="k"&gt;typeof&lt;/span&gt; &lt;span class="p"&gt;{}&lt;/span&gt; &lt;span class="c1"&gt;// "object"&lt;/span&gt;

&lt;span class="k"&gt;typeof&lt;/span&gt; &lt;span class="kc"&gt;null&lt;/span&gt; &lt;span class="c1"&gt;// "object"&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;h2&gt;
  
  
  Why is null an object
&lt;/h2&gt;

&lt;p&gt;This is a bug which states that null is an object and one that unfortunately can’t be fixed because it would break the existing code of people.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>codenewbie</category>
      <category>100daysofcode</category>
      <category>webdev</category>
    </item>
    <item>
      <title>01 - Introduction to JavaScript | History | Current status</title>
      <dc:creator>catch(js)</dc:creator>
      <pubDate>Tue, 30 Jun 2020 08:55:05 +0000</pubDate>
      <link>https://forem.com/js_catch/01-introduction-to-javascript-history-current-status-58o9</link>
      <guid>https://forem.com/js_catch/01-introduction-to-javascript-history-current-status-58o9</guid>
      <description>&lt;h1&gt;
  
  
  What is JavaScript
&lt;/h1&gt;

&lt;p&gt;Javascript is popularly known as a powerful scripting language for controlling web pages.&lt;/p&gt;

&lt;p&gt;Tho' It was originally designed as a scripting language for websites but it has evolved so much since then that now javascript is used everywhere. Through javascript, you can build web applications, create APIs, build mobile applications, even do Machine Learning, and what not...&lt;/p&gt;

&lt;h1&gt;
  
  
  History of javascript
&lt;/h1&gt;

&lt;p&gt;In September 1995, a Netscape programmer named &lt;a href="https://en.wikipedia.org/wiki/Brendan_Eich"&gt;Brandan Eich&lt;/a&gt; developed a scripting language in just 10 days which was named Mocha.&lt;br&gt;
Then it was named LiveScript and later &lt;em&gt;javascript&lt;/em&gt; which became one of the most popular programming languages.&lt;/p&gt;

&lt;h1&gt;
  
  
  What is ECMAScript
&lt;/h1&gt;

&lt;p&gt;ECMAScript provides the rules, details, and guidelines that a scripting language must follow to be considered ECMAScript compliant. Thus javascript is a scripting language which is based on ECMAScript and follows the ECMAScript specification. Releasing a new edition of ECMAScript with new features does not mean that JavaScript will also be having those new features immediately. Javascript might take some time to adopt those new ECMAScript features.&lt;/p&gt;

&lt;p&gt;Here is a list of ECMAScript Editions:&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Version&lt;/th&gt;
&lt;th&gt;Year&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;ES1&lt;/td&gt;
&lt;td&gt;1997&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;ES2&lt;/td&gt;
&lt;td&gt;1998&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;ES3&lt;/td&gt;
&lt;td&gt;1999&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;ES4&lt;/td&gt;
&lt;td&gt;Never Released&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;ES5&lt;/td&gt;
&lt;td&gt;2009&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;ES6&lt;/td&gt;
&lt;td&gt;2015&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;ES7&lt;/td&gt;
&lt;td&gt;2016&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;ES8&lt;/td&gt;
&lt;td&gt;2017&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;ES9&lt;/td&gt;
&lt;td&gt;2018&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;h1&gt;
  
  
  Current Status of Javascript
&lt;/h1&gt;

&lt;p&gt;Javascript has a very large ecosystem and most importantly a great community. Tho' Javascript has a simple syntax and is easy to start with but is almost impossible to master. it is quite a funny language with lots of tricky parts which we are gonna cover in our upcoming articles.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>webdev</category>
      <category>100daysofcode</category>
      <category>codenewbie</category>
    </item>
    <item>
      <title>Catch(js) Introduction</title>
      <dc:creator>catch(js)</dc:creator>
      <pubDate>Mon, 29 Jun 2020 07:29:45 +0000</pubDate>
      <link>https://forem.com/js_catch/catch-js-introduction-4c66</link>
      <guid>https://forem.com/js_catch/catch-js-introduction-4c66</guid>
      <description>&lt;h2&gt;
  
  
  What is Catch(js) ?
&lt;/h2&gt;

&lt;p&gt;Catch(js) is a series of articles that go from basics to advanced topics in javascript with simple yet detailed explanations.&lt;/p&gt;

&lt;h2&gt;
  
  
  Content of articles?
&lt;/h2&gt;

&lt;p&gt;The articles will be focussed on the core mechanics of javascript and some of the topics that will be covered are :&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;this&lt;/li&gt;
&lt;li&gt;Primitive and non-primitive data types&lt;/li&gt;
&lt;li&gt;Coercion&lt;/li&gt;
&lt;li&gt;What is 'use strict'&lt;/li&gt;
&lt;li&gt;function expression and function declaration&lt;/li&gt;
&lt;li&gt;Arrow functions vs regular function&lt;/li&gt;
&lt;li&gt;Objects&lt;/li&gt;
&lt;li&gt;Array and Object methods&lt;/li&gt;
&lt;li&gt;Garbage collection&lt;/li&gt;
&lt;li&gt;Event loop&lt;/li&gt;
&lt;li&gt;Prototypes&lt;/li&gt;
&lt;li&gt;Error handling&lt;/li&gt;
&lt;li&gt;IIFE&lt;/li&gt;
&lt;li&gt;Scope&lt;/li&gt;
&lt;li&gt;Closures&lt;/li&gt;
&lt;li&gt;The Module Pattern&lt;/li&gt;
&lt;li&gt;Class-based syntax&lt;/li&gt;
&lt;li&gt;Hoisting&lt;/li&gt;
&lt;li&gt;Currying&lt;/li&gt;
&lt;li&gt;Memoization&lt;/li&gt;
&lt;li&gt;apply, call, and bind methods&lt;/li&gt;
&lt;li&gt;Asynchronous JS&lt;/li&gt;
&lt;li&gt;Callbacks&lt;/li&gt;
&lt;li&gt;Promises&lt;/li&gt;
&lt;li&gt;Async &amp;amp; Await&lt;/li&gt;
&lt;li&gt;Generators&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;em&gt;And many more topics...&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  What to expect from this series?
&lt;/h2&gt;

&lt;p&gt;The series of articles will help people increase their expertise in javascript, As the articles will be short and concise one can also brush up the topics through this series for interviews.&lt;/p&gt;

&lt;h2&gt;
  
  
  Authors of Catch(js):
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://twitter.com/notrohan_"&gt;Rohan Sharma&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://twitter.com/__akash__19"&gt;Akash bhandwalkar&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;You can reach us at any time for doubts regarding the topics covered or if you want us to write about a particular topic.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>codenewbie</category>
      <category>100daysofcode</category>
      <category>beginners</category>
    </item>
  </channel>
</rss>
