JavaScript
  Home arrow JavaScript arrow JavaScript Arrays: Pushing, Popping and Sh...
Dev Articles Forums 
ADO.NET  
Apache  
ASP  
ASP.NET  
C#  
C++  
ColdFusion  
COM/COM+  
Delphi-Kylix  
Design Usability  
Development Cycles  
DHTML  
Embedded Tools  
Flash  
Graphic Design  
HTML  
IIS  
Interviews  
Java  
JavaScript  
MySQL  
Oracle  
Photoshop  
PHP  
Reviews  
Ruby-on-Rails  
SQL  
SQL Server  
Style Sheets  
VB.Net  
Visual Basic  
Web Authoring  
Web Services  
Web Standards  
XML  
Mobile Linux 
App Generation ROI 
IBM® developerWorks 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us Get Paid 
Request Media Kit
Contact Us 
Site Map 
Privacy Policy 
Support 
 USERNAME
 
 PASSWORD
 
 
  >>> SIGN UP!  
  Lost Password? 
JAVASCRIPT

JavaScript Arrays: Pushing, Popping and Shifting
By: Jagadish Chaterjee
  • Search For More Articles!
  • Disclaimer
  • Author Terms
  • Rating: 4 stars4 stars4 stars4 stars4 stars / 19
    2006-03-21

    Table of Contents:
  • JavaScript Arrays: Pushing, Popping and Shifting
  • How to append an element to an array using JavaScript: discussion
  • How to pop (or delete at end) an element from an array using JavaScript
  • How to delete an element at the top from an array using JavaScript
  • How to add an element to the top of an array using JavaScript

  • Rate this Article: Poor Best 
      ADD THIS ARTICLE TO:
      Del.ici.ous Digg
      Blink Simpy
      Google Spurl
      Y! MyWeb Furl
    Email Me Similar Content When Posted
    Add Developer Shed Article Feed To Your Site
    Email Article To Friend
    Print Version Of Article
    PDF Version Of Article
     
     
    ADVERTISEMENT


    JavaScript Arrays: Pushing, Popping and Shifting


    (Page 1 of 5 )

    This series of articles mainly concentrates on working with JavaScript arrays. This is the fourth article in the series and mainly concentrates on working with multiple arrays effectively. You can reuse these scripts to inject into server side controls easily (especially in .NET and Java).

    I already covered single dimensional and two dimensional arrays in my first article.  If you are new to JavaScript arrays, I strongly suggest you go through that article.  All of the examples in this series can be directly tested, by simply copying and pasting the entire code (of each section) into any text file with the extension .HTM and opening it using a browser.

    How to append an element to an array using JavaScript

    I already covered different kinds of arrays in my first article.  I explained combining (joining) and splitting of arrays in my second article.  The third article covered copying, transferring and merging data.  And in this section I focus on “pushing” (also called “appending”) an element to an array.

    Now, let us try to develop a simple script (JavaScript) which adds (or pushes) a single element at the end of an array.  Have a look at the following code:

    <html>
          <head>
                <meta  name=vs_targetSchema  content="http://schemas.microsoft.com/intellisense/ie5">
    <script  id="clientEventHandlersJS"  language="javascript">
    <!--
    functionShow()
    {
          var myArray = new Array();
          myArray[0] = "Jag";
          myArray[1] = "Chat";
          myArray[2] = "Win";
          myArray[3] = "Dhan";
          document.write("Before adding<br>-------------<br>");
          for (var i = 0; i < myArray.length; i++) 
          {
                document.write(myArray[i] + "<BR>");
          }
          myArray.push("aaa");
          document.write("<br>After adding<br>-------------<br>");
          for (var i = 0; i < myArray.length; i++) 
          {
                document.write(myArray[i] + "<BR>");
          }
    }

    function ButtonPush_onclick() {
          Show();
    }
    //-->
                </script>
          </head>
          <body>
          <form  id="form1">
                      <input  type="button"  value="Push and Show"  id="ButtonPush"  name="ButtonPush"  onclick="return ButtonPush_onclick()">
                </form>
          </body>
    </html>

    Actually, within the above code, the “meta” tag is not necessary.  Because I developed the above code using Visual Studio.NET 2003 Enterprise Architect, it was automatically added to provide its full-featured mechanisms. 

    When the above code is executed we get the following output:

    Before adding
    -------------
    Red
    Green
    Blue
    White

    After adding
    -------------
    Red
    Green
    Blue
    White

    aaa

    The explanation for the above code is in the next section.

    More JavaScript Articles
    More By Jagadish Chaterjee


       · Hello. This is another extension to "Javascript Arrays" discussion. You are free...
     

    JAVASCRIPT ARTICLES

    - Using jQuery to Preload Images with CSS and ...
    - Using Client-Side Scripting to Preload Image...
    - Removing Non-Semantic Markup when Preloading...
    - Using the Display CSS Property to Preload Im...
    - Preloading Images with CSS and JavaScript
    - Scaling and Moving Web Page Elements with th...
    - Fading, Hiding and Sliding HTML Elements wit...
    - Toggling CSS Properties with the GX JavaScri...
    - Cancel, Queue and Pause Animations with the ...
    - Producing Elastic Effects with the GX JavaSc...
    - Moving Divs Diagonally with the GX JavaScrip...
    - Moving Elements Vertically and Horizontally ...
    - Making Bouncing Effects in Parallel with the...
    - Creating Bouncing Effects with the GX JavaSc...
    - Manipulating Background Colors with the GX J...







    © 2003-2010 by Developer Shed. All rights reserved. DS Cluster 9 Hosted by Hostway
    For more Enterprise Application Development news, visit eWeek