Exforsys

JavaScript Tutorial

  1. JavaScript Browser Objects Part 2
  2. JavaScript Frame object
  3. JavaScript Form Object
  4. JavaScript FileUpload Object
  5. JavaScript Event Object Properties and Methods
  6. JavaScript Event Object
  7. JavaScript Elements and Embed Objects
  8. JavaScript Applet Objects
  9. JavaScript Browser Objects
  10. JavaScript Object Oriented Features
  11. JavaScript Window Object Open Method Part 2
  12. JavaScript Window Object Open Method
  13. JavaScript Window Object Timeout Methods
  14. JavaScript Location Object
  15. JavaScript Location Object Properties
  16. JavaScript History Object Properties and Methods
  17. JavaScript Document Object Methods Part II
  18. JavaScript Document Object Methods Part I
  19. JavaScript Document Object Properties
  20. JavaScript Document Object
  21. JavaScript Windows Object Properties Part II
  22. JavaScript Windows Object Properties Part I
  23. JavaScript DOM Window Object
  24. Working with JavaScript DOM Objects
  25. JavaScript Array Object Methods – Part II
  26. JavaScript Array Object
  27. JavaScript Array Object Methods – Part I
  28. JavaScript Boolean Object
  29. JavaScript OnError Event
  30. JavaScript Exception Handling – Part II
  31. JavaScript Exception Handling – Part I
  32. JavaScript Event Handler
  33. JavaScript Events Handling
  34. JavaScript Array Operations
  35. JavaScript Two Dimensional Arrays
  36. Passing values to JavaScript Function
  37. JavaScript Functions
  38. JavaScript Arrays
  39. JavaScript Iterative Structures - Part II
  40. JavaScript Iterative Structures - Part I
  41. JavaScript Math Object
  42. JavaScript Date Object
  43. JavaScript String Object
  44. JavaScript Objects
  45. JavaScript Confirm Box
  46. JavaScript Alert Box
  47. JavaScript Conditional Statements Part 2
  48. JavaScript Conditional Statements Part 1
  49. How to use JavaScript in HTML page
  50. JavaScript Variables
  51. JavaScript Features
  52. JavaScript Introduction

Ads


Home arrow Technical Training arrow JavaScript Tutorial

JavaScript Array Object shift() and unshift()

Page 2 of 2
Author : Exforsys Inc.     Published on: 17th Jul 2007

JavaScript Array Object Methods – Part II

shift():

As the pop() method removes and returns the last element, the shift() method removes and returns the first element of an array object. Since the first element is removed and returned this also affects the length of the array.

Ads

General syntax of the shift() method of the Array object of JavaScript:

arrayObject.shift()

Example


<html>
   <
body>
      <
script type="text/javascript">

         var exforsys = new Array(4)
         exforsys[0] = "Welcome"
         exforsys[1] = "To"
         exforsys[2] = "Exforsys"
         exforsys[3] = "Training"
         document.write(exforsys + "<br />")
         document.write(exforsys.shift() + "<br />")
         document.write(exforsys)

      </
script>
   </
body>
</
html>


The output of the code above will be:


Welcome,To,Exforsys,Training
Welcome
To,Exforsys,Training


In the above example, the array object exforsys elements are first outputted and the shift() method is then used with the array object exforsys which removes and returns the first element of the array object exforsys (Training). The next document statement prints the array without the first element since it has been removed out in the previous statement.

unshift():

If a programmer wants to add one or more elements to the end of the array, he can use the push() method of the array object. There may be situations where a programmer might wish to add one or more elements to the beginning of the array. This can be achieved by using the unshift() method of the array object. The unshift() method of an array object is used to add one or more elements to the beginning of an array and returns the new length.

General syntax of the unshift() method of the Array object of JavaScript:

arrayObject.unshift(newelement1,newelement2,....,newelementn)

The newelement1, newelement2,...., newelementn represents the new elements to be added to the array object. It is required that at least newelement1 must be present. This means there must be at least one element specified in argument of the unshift() method to be added. The newelement2,....,newelementn are optional.

Example


<html>
   <
body>
      <
script type="text/javascript">

         var exforsys = new Array(4)
         exforsys[0] = "Welcome"
         exforsys[1] = "To"
         exforsys[2] = "Exforsys"
         exforsys[3] = "Training"
         document.write(exforsys+"<br />")
         document.write(exforsys.unshift("Welcome
         Message")+"<br />")
         document.write(exforsys)

      </
script>
   </
body>
</
html>


The output of the code above will be:


Welcome,To,Exforsys,Training
5
Welcome Message,Welcome,To,Exforsys,Training


Ads

In the above example, the array object exforsys elements are first outputted and then the unshift method() used with the exforsys array object has in its argument "Welcome Message". This is added to the beginning of the array object exforsys and changes the length of the array exforsys to 5. This prints and the new array with "Welcome Message" added to the beginning of the array is outputted.



 
This tutorial is part of a JavaScript Tutorial tutorial series. Read it from the beginning and learn yourself.

JavaScript Tutorial

  1. JavaScript Browser Objects Part 2
  2. JavaScript Frame object
  3. JavaScript Form Object
  4. JavaScript FileUpload Object
  5. JavaScript Event Object Properties and Methods
  6. JavaScript Event Object
  7. JavaScript Elements and Embed Objects
  8. JavaScript Applet Objects
  9. JavaScript Browser Objects
  10. JavaScript Object Oriented Features
  11. JavaScript Window Object Open Method Part 2
  12. JavaScript Window Object Open Method
  13. JavaScript Window Object Timeout Methods
  14. JavaScript Location Object
  15. JavaScript Location Object Properties
  16. JavaScript History Object Properties and Methods
  17. JavaScript Document Object Methods Part II
  18. JavaScript Document Object Methods Part I
  19. JavaScript Document Object Properties
  20. JavaScript Document Object
  21. JavaScript Windows Object Properties Part II
  22. JavaScript Windows Object Properties Part I
  23. JavaScript DOM Window Object
  24. Working with JavaScript DOM Objects
  25. JavaScript Array Object Methods – Part II
  26. JavaScript Array Object
  27. JavaScript Array Object Methods – Part I
  28. JavaScript Boolean Object
  29. JavaScript OnError Event
  30. JavaScript Exception Handling – Part II
  31. JavaScript Exception Handling – Part I
  32. JavaScript Event Handler
  33. JavaScript Events Handling
  34. JavaScript Array Operations
  35. JavaScript Two Dimensional Arrays
  36. Passing values to JavaScript Function
  37. JavaScript Functions
  38. JavaScript Arrays
  39. JavaScript Iterative Structures - Part II
  40. JavaScript Iterative Structures - Part I
  41. JavaScript Math Object
  42. JavaScript Date Object
  43. JavaScript String Object
  44. JavaScript Objects
  45. JavaScript Confirm Box
  46. JavaScript Alert Box
  47. JavaScript Conditional Statements Part 2
  48. JavaScript Conditional Statements Part 1
  49. How to use JavaScript in HTML page
  50. JavaScript Variables
  51. JavaScript Features
  52. JavaScript Introduction
 

Comments