Array Concatenation : Array « Language Basics « JavaScript DHTML






  1. JavaScript DHTML
  2. Language Basics
  3. Array

Array Concatenation

  
<HTML>
<HEAD>
<TITLE>Array Concatenation</TITLE>
<SCRIPT LANGUAGE="JavaScript1.1">

var arrayOne, arrayTwo, arrayThree, textObj

function initialize() {
    var form = document.forms[0]
    textObj = form.original
    arrayOne = new Array("A", "B","C")
    arrayTwo = new Array("D", "E",textObj)
    arrayThree = arrayOne.concat(arrayTwo)
    update1(form)
    update2(form)
    showArrays()
}

function showArrays() {
    var form = document.forms[0]
    form.array1.value = arrayOne.join("\n")
    form.array2.value = arrayTwo.join("\n")
    form.array3.value = arrayThree.join("\n")
}

function update1(form) {
    arrayThree[0] = form.source1.value
    form.result1.value = arrayOne[0]
    form.result2.value = arrayThree[0]
    showArrays()
}
function update2(form) {
    arrayThree[5].value = form.source2.value
    form.result3.value = arrayTwo[2].value
    form.result4.value = arrayThree[5].value
    showArrays()
}
</SCRIPT>
</HEAD>
<BODY onLoad="initialize()">
<FORM>
<TABLE>
<TR><TH>arrayOne</TH><TH>arrayTwo</TH><TH>arrayThree</TH></TR>
<TR>
<TD><TEXTAREA NAME="array1" COLS=25 ROWS=6></TEXTAREA></TD>
<TD><TEXTAREA NAME="array2" COLS=25 ROWS=6></TEXTAREA></TD>
<TD><TEXTAREA NAME="array3" COLS=25 ROWS=6></TEXTAREA></TD>
</TR>
</TABLE>
<B>Enter new value for arrayThree[0]:</B>
<INPUT TYPE="text" NAME="source1" VALUE="X">
<INPUT TYPE="button" VALUE="Change arrayThree[0]" onClick="update1(this.form)"><BR>
Current arrayOne[0] is:<INPUT TYPE="text" NAME="result1"><BR>
Current arrayThree[0] is:<INPUT TYPE="text" NAME="result2"><BR>
<HR>
textObj assigned to arrayTwo[2]:
<INPUT TYPE="text" NAME="original" onFocus="this.blur()"></BR>
<B>Enter new value for arrayThree[5]:</B>
<INPUT TYPE="text" NAME="source2" VALUE="Y">
<INPUT TYPE="button" VALUE="Change arrayThree[5].value" onClick="update2(this.form)"><BR>
Current arrayTwo[2].value is:<INPUT TYPE="text" NAME="result3"><BR>
Current arrayThree[5].value is:<INPUT TYPE="text" NAME="result4"><P>
<INPUT TYPE="button" VALUE="Reset" onClick="location.reload()">
</FORM>
</BODY>
</HTML>








Related examples in the same category

1.Demo all methods in Array
2.Assing array value inside function
3.Simple Array Demo
4.Array loop, find:Control array : Two dimension array
5.Reversing, Sorting, and Concatenating an Array
6.Custom Numeric Comparison for the Array.Sort Method
7.Case-Insensitive Comparison for the Array.Sort Method
8.Iterating Through a Sparse Array
9.Using Functions to Iterate Through an Array
10.Reading and Writing Array Elements
11.Array with a numeric parameter and assign data to it
12.A string array
13.Array - properties and methods:length, join, reverse, push,pop,shift
14.Array - sort()
15.Array - concat and slice
16.Array - splice
17.Methods and Properties of the Array Object
18.Displaying the Contents of an Array
19.Using the Array.join() Method
20.Using JavaScript Arrays
21.Extending the Length of an Array
22.An Array within an Array
23.Using the Methods of the Array object
24.Array.sort() Possibilities
25.Array.reverse() Method
26.A Looping Array Lookup
27.A Simple Parallel Array Lookup
28.Adding a prototype Property
29.Two-Dimensional Array Work Around
30.Array definition and iteration
31.Reference an Array by index
32.URL Array
33.Array Utility functions
34.Dynamic array
35.Use for loop to display elements in an array
36.A string array variable
37.Queue based on array