codinggiri

A quick intorduction to arrays in JavaScript - Part 1

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-e2UyQF636YU/U07Hv5gvnCI/AAAAAAAAAL0/NYNpdrnHBQo/s1600/Snap+2014-04-16+at+23.36.31.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/-e2UyQF636YU/U07Hv5gvnCI/AAAAAAAAAL0/NYNpdrnHBQo/s1600/Snap+2014-04-16+at+23.36.31.png" /></a></div>
<br />
what's up guys welcome to this blog once again. Today we will learn about arrays in JavaScript
, You know how to create variables and assign there value you also know that there ara data types like 
integer , float , string etc. I mean with one variable you can store data of similar data type BUT what if you want to
store data of different data type in one place ? In that situation Array comes in action.
Array is similar to a variable in which you can store / hold any type of data to clear your doubts let me give you an example
 
<br />
<blockquote>
As you already know that a variable an store one piece of data at a time and when the value of that variable is changed
the previous value is lost like take the example below:- 
</blockquote>
<pre class="prettyprint lang-js">	var myVar = 10; // The value of variable myVar is 10 now
	alert(myVar) //This will open a alert box with value 10
	/*---------------------------------------------
	*
	But what if i again assign the value of
	variable myVar to 22 and use the alert
	method to display the value of variable myVar?
	Yes you are thinking right the new value on
	alert box will be 22 and the previous value 10
	will be lost.
	*
	-----------------------------------------------*/
	
	var myVar = 22; // The value is changed now
	alert(myVar) // Previous value is lost and we have now 22
	
</pre>
<blockquote>
The main difference between a variable and an array is , A variable can hold only one piece of data at a time
but an array can store more than  one piece of data at a same time i mean you can store the both value 10 and 22
into an array .
</blockquote>
<h3>
Creating an array in JavaScript</h3>
Let me remind you once again that JavaScript is a case sensitive language and if you use array() rather than
Array() , the code will not work <br />
so , to create an array you have to declare the variable first and then tell JavaScript that you want this variable as 
and Array.
<br />
<pre class="prettyprint lang-js">	var myArray;
	myArray = new Array();
	/*-----------------------------------
	This was method of declaring an Array 
	now if you want to store data into 
	your new Array you have to follow this
	--------------------------------------*/
	
	var myArray = new Array(1,2,3,4,5,6);
	 /*--------------------------------------
	 Just put your data between parentheses 
	 separated by comma(,) and you are done 
	 ----------------------------------------*/
	 
	 /*---------------------------------------
	 you can put strings also , not only numbers
	 -----------------------------------------*/
	 
	 var myArray = new Array("Ved", "love" , "Code");
	 
	 /*-----------------------------------------
	 Even you can mix the type of data in an
	 Array
	 -------------------------------------------*/
	 
	 var myArray = new Array("Hello","ved",22, null);
</pre>
<h3>
Indexing of an JavaScript Array</h3>
<blockquote>
Always remember that we humans start counting from one(1) not zero(0) but computers are 
not like that , computers start counting from zero(0) not (1).
that's means first piece of data will store at position 0,
second piece of data will store at position 1,
third piece of data will store at position 2 and so on
 for example lets take the 
example of our previous Array
</blockquote>
<pre class="prettyprint lang-js">	var myArray  new Array("Hello","ved",22,"code")
	/*-----------------------------------------
	If we start counting ( like humans ) then 
	we will index the items of this Array like
	
	
	*-*-*-*-*-*-*-*-
	| Hello - 1st, |
	* ved - 2nd,   *
	| 22- 3rd,     |
	* code- 4th    *
	*-*-*-*-*-*-*-*-
	
	but on other side computer will index this 
	array as follow
	
	
	*-*-*-*-*-*-*-*-*-*-
	| Hello - 0(zero), |
	* ved - 1st,       *
	| 22 - 2nd,        |
	* code - 3rd,      *
	*-*-*-*-*-*-*-*-*-*-
	
	
	-------------------------------------------*/
</pre>
<h3>
Adding data into an JavaScript Array</h3>
It is not necessary to pre-store data in a JavaScript Array, That's mean you can create an Empty Array 
and later then add data to that Array with indexing like thale the example above
<br />
<pre class="prettyprint lang-js">	var myArray = new Array(); //we create an Emplt array here
	//now we will add data to this Array with Indexing
	myArray[0] = "I";
	myArray[1] = "love";
	myArray[2] = "coding";
	myArray[3] = 24;
	myArray[4] = "X";
	myArray[5] = 7;
	
	/*
	---------------------------------------------------------
	after that to check that the data is stored in myArray or
	not you can do that with alert(myArray) and it will display
	the values stored in myArray
	-----------------------------------------------------------
	*/
	
	
</pre>
<h3>
Using .push method to add data into an Array</h3>
You can also insert/add data into an JavaScript Array with .push method
if our Array is an Empty Array then the Data will store at position Zero otherwise
if there are 10 items in your Array then your new item will be stored at position 
ten(remember that computer start counting from zero)
have a look at the Example Below we will use the .push method with our 
previous Array
<br />
<pre class="prettyprint lang-js">	var myArray = new Array(); //we create an Emplt array here
	//now we will add data to this Array with Indexing
	myArray[0] = "I";
	myArray[1] = "love";
	myArray[2] = "coding";
	myArray[3] = 24;
	myArray[4] = "X";
	myArray[5] = 7;
    myArray.push("hello",34); //The data will be added 
    alert(myArray); // Display the result
</pre>
All right folks i think this is enough for this post , in next post we will learn more on Arrays
in JavaScript like and some other feautures of it like push , pop , slice , shift , sort etc.
Thanks for reading guys please comment below if you facing any problem :)
</div>

A quick intorduction to arrays in JavaScript - Part 1

what's up guys welcome to this blog once again. Today we will learn about arrays in JavaScript , You know how to create variables an...

JavaScript Exercise Session 1st - Solutions with explanation

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-N7MW5mHCwU4/U0jCfCRKVRI/AAAAAAAAALk/yMwXglgSLUw/s1600/Snap+2014-04-12+at+10.03.50.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="http://3.bp.blogspot.com/-N7MW5mHCwU4/U0jCfCRKVRI/AAAAAAAAALk/yMwXglgSLUw/s1600/Snap+2014-04-12+at+10.03.50.png" width="289" /></a></div>
<br />
<br />
Hey there welcome once again Hope you are enjoying learning coding :) . In this post i am going to post the answer of those 5
 questions which was  posted in last blog post.
<br />
<ul>
<li>Use the console.log or alert , to Display this simple message: </li>

 <blockquote>
"Hello ! JavaScript"</blockquote>
Here is the answer<br />

<pre class="prettyprint lang-js">  console.log("Hello ! JavaScript");
 </pre>
or you can use the alert method too<br />

<pre class="prettyprint lang-js">  alert("Hello ! JavaScript");
 </pre>
<li>Take three variables a,b and c. assign some integer values to first two variables a and b. now show 
 assign (a and b) sum (+) , diffrence(-) and multiplication(*) values in to variable c </li>

 Here is the answer<br />

<pre class="prettyprint lang-js">  var a = 10; /*Assigning the value of a to 10*/
        var b = 5; /*Assigning the value of b to 5*/
        var c = a+b; /*Telling the interpreter that value of c is equal to sum of a and b */
        alert(c); /*Displaying the result */
 </pre>
Please follow the comments <br />
<li>Take a variable A, now use prompt to ask user his/her name and print a greeting message. </li>

 Here is the answer<br />

<pre class="prettyprint lang-js">  var a = prompt("What is your name: ");
  /*Take a variable a 
  then ask user to enter his/her name nad store the value entered
  by user into variable a
  */
  alert("Nice to Meet you " + a); 
  /*Now use the alert method to 
   disply the greeting message 
  */

</pre>
<li>Take a variable A and print the square value. </li>

 we will use mathematical operator to square the value<br />

<pre class="prettyprint lang-js">  
  var a = prompt("Please give me a number: ");// store the value entered by user in variable a
  a = parseFloat(a); // This may sound tricky but we will cover it later
  var b = Math.pow(a,2); // This is pow method in JS
  b = parseFloat(b); 
  alert(b);
  /*Overall this answer may bounce over from your head but don't
  you worry you will master them all soon just saty tuned 
  and read my next posts
  */
 </pre>
<li>We are going to find out the area of a rectangle so for that Take Three variables named 
 first,second and Final. use prompt to ask user to give the length and width, then store the 
 area of rectangle into third variable and finally print the area. </li>

 Here is the answer<br />

<pre class="prettyprint lang-js"> 
 var first = prompt("Please tell me the length: ");/*store value of length in variable first*/
 first = parseFloat(first); /*Now convert the entred value into float*/
 var second = prompt("Please tell me the width: ");/*store the value of width in variable second*/
 second = parseFloat(second); /*Now convert the entred value into Float*/
 var final = (first * second); /*value of final is equal to the multiplication of first and second (variables) */
 final = parseFloat(final); /*Again convert the value of final in float with parseFloat*/
 alert("The area of rectangle is " + final ); /*Finally display the result like a boss*/
 </pre>
So folks i hope you can understand the explained answers and agian if you are facing any problem feel free to comment below
 and let me know i'll surely help you out 
 <br />

</ul>
</div>

JavaScript Exercise Session 1st - Solutions with explanation

Hey there welcome once again Hope you are enjoying learning coding :) . In this post i am going to post the answer of those 5 question...

codinggiri

A quick intorduction to arrays in JavaScript - Part 1

JavaScript Exercise Session 1st - Solutions with explanation

Popular Posts

Labels

Blog Archive