<?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: royelWilliams</title>
    <description>The latest articles on Forem by royelWilliams (@royelwilliams).</description>
    <link>https://forem.com/royelwilliams</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%2F1006478%2F5cea9350-8b41-4d30-9ce9-fdbd9015513f.jpeg</url>
      <title>Forem: royelWilliams</title>
      <link>https://forem.com/royelwilliams</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/royelwilliams"/>
    <language>en</language>
    <item>
      <title>Variables and Keywords</title>
      <dc:creator>royelWilliams</dc:creator>
      <pubDate>Thu, 12 Jan 2023 04:19:08 +0000</pubDate>
      <link>https://forem.com/royelwilliams/variables-and-keywords-3h7j</link>
      <guid>https://forem.com/royelwilliams/variables-and-keywords-3h7j</guid>
      <description>&lt;p&gt;In the coding language JavaScript there are  three common variables used; var let and const. These variables can be a great  benefit to your code. They can also lead to many complications and issues throughout the code if used incorrectly.&lt;/p&gt;

&lt;p&gt;First let's start with the basics of why we need variables when coding. Variables are used to store and or manipulate data. They are able to store any type of data from basic strings to complex functions. They are used as labels to point to the data that will be used itself. You can think of them like the middleman to code. Any variable that you use should be accompanied by a keyword var, let, or const.  &lt;/p&gt;

&lt;p&gt;Writing a variable can be very easy. First you call your keyword whether it be var, let, or const and following the key word will be whatever variable you desire. A variable can be anything that you want. It can also be written in various ways from camelCase (when the first word is lowercase and every word following it will begin with a capital letter) pascal Case (when every letter of a new word is capitalized including the first word), snake case(where you would add an underscore where spaces would be between words) of course there are other ways you can write a variable like with skewer-case  or SCREAMING_SNAKE_ CASE but those ways may be a little less common.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Keywords and Differences&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Var was the primary keyword used up until the big JavaScript update in 2015 where const and let were introduced into the program. Let and const made a great change and improvement to JavaScript as you no longer had the issue of messing up code if you used the same variable or if you did not include a variable to go with the keyword.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzyt1ayz8u7rjvrdqnonb.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fzyt1ayz8u7rjvrdqnonb.png" alt="Image description" width="487" height="209"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;VAR&lt;/strong&gt; &lt;br&gt;
The var keyword can be both globally scoped and local scoped(function scoped).This means that anything that is using the var keyword can be declared both in and out of the global scope. The var keyword can also be redeclared and reassigned. This can create problems in your code later. This can easily lead to one variable being used for different code which can ruin or crash the program you are working with.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;sam&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;This is a simple var declaration &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="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;sam&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;This is a simple var declaration&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
&lt;span class="kd"&gt;var&lt;/span&gt; &lt;span class="nx"&gt;sam&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;This is what i am changing it to&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="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;sam&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;This is what i am changing it to&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
&lt;span class="c1"&gt;//when using the var declaration if you change the code that is attached to the variable things can get messy down the line&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;LET&lt;/strong&gt;&lt;br&gt;
The let keyword is more of a function scope(block scope) keyword. A blocks scope  is a chunk of code bounded by brackets(curly braces). Anything within curly braces is a block scope. When using this scope if you call anything with the let variable outside of &lt;br&gt;
It will not return any result. It is also important to know that a variable declared with let can be updated within its scope. Unlike var, a let variable can not be re-declared within its scope.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-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;dorthy&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;A storm is coming &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; 
&lt;span class="c1"&gt;//console.log(dorthy) =&amp;gt; "A storm is coming"&lt;/span&gt;
&lt;span class="c1"&gt;//let dorthy = "I want to go home"&lt;/span&gt;
&lt;span class="c1"&gt;//console.log(dorthy) =&amp;gt; dorthy has already been declared&lt;/span&gt;
&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;todo&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;tinMan&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
   &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;dorthy&lt;/span&gt; 
  &lt;span class="kd"&gt;let&lt;/span&gt; &lt;span class="nx"&gt;lion&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;im scared&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="c1"&gt;//console.log(todo(dorthy)) =&amp;gt; "A storm is coming"&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nf"&gt;todo&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;lion&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;lion&lt;/span&gt; &lt;span class="nx"&gt;is&lt;/span&gt; &lt;span class="nx"&gt;not&lt;/span&gt; &lt;span class="nx"&gt;defined&lt;/span&gt;
&lt;span class="c1"&gt;// lion is not defined outside of the function scope&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;&lt;strong&gt;CONST&lt;/strong&gt;&lt;br&gt;
Like let declarations, const declarations can only be accessed within the block they were declared. So when they are declared outside of their scope they will return undefined. When using the const keyword it is also important to know that  it remains the same within its scope. It cannot be updated or re-declared.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight javascript"&gt;&lt;code&gt;&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;dorthy&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;A storm is coming &lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt; 
&lt;span class="c1"&gt;//console.log(dorthy) =&amp;gt; "A storm is coming"&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;dorthy&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;I want to go home&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
&lt;span class="c1"&gt;//console.log(dorthy) =&amp;gt; dorthy has already been declared&lt;/span&gt;
&lt;span class="kd"&gt;function&lt;/span&gt; &lt;span class="nf"&gt;todo&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;tinMan&lt;/span&gt;&lt;span class="p"&gt;){&lt;/span&gt;
   &lt;span class="k"&gt;return&lt;/span&gt; &lt;span class="nx"&gt;dorthy&lt;/span&gt; 
  &lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;lion&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;im scared&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;span class="c1"&gt;//console.log(todo(dorthy)) =&amp;gt; "A storm is coming"&lt;/span&gt;
&lt;span class="nx"&gt;console&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;log&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nf"&gt;todo&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;lion&lt;/span&gt;&lt;span class="p"&gt;))&lt;/span&gt; &lt;span class="o"&gt;=&amp;gt;&lt;/span&gt; &lt;span class="nx"&gt;lion&lt;/span&gt; &lt;span class="nx"&gt;is&lt;/span&gt; &lt;span class="nx"&gt;not&lt;/span&gt; &lt;span class="nx"&gt;defined&lt;/span&gt;
&lt;span class="c1"&gt;// lion is not defined outside of the function scope&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;To sum, It is important to understand the connections between keywords and variables as they can really save a code. Understand that by calling different keywords you are opening the gate to allow the code connected to the keyword and variable to be used in various ways. Also recognize the benefits that using different keywords provides as we code. &lt;br&gt;
Happy Coding!!&lt;/p&gt;

</description>
      <category>ai</category>
      <category>productivity</category>
    </item>
  </channel>
</rss>
