Introduction to String Array in JavaScript
JavaScript support various types of array, string array is one of them. String array is nothing but it’s all about the array of the string. The array is a variable that stores the multiple values of similar types. In the context of a string array, it stores the string value only. The string is a combination of characters. Here are few examples of string – “RAM”, “SHYAM”, “XYZ”, “xyz” etc. There is nothing different from the array of string to the array of integers or the decimals. Almost all the functionality remains the same.
Type of Array in JavaScript with Example
There are two types of string array like integer array or float array.
- Traditional Array
- String Array as An Object
1. Traditional Array
This is a normal array. In this, we declare an array in such a way the indexing will start from 0 itself. 0 will be followed by 1, 2, 3, ….n.
var characters = ["AB", "CD", "XY"];
var in a key use to declare any variable. “characters” is the name of the array. AB, CD, XY are values stored in the array. In the example array declaration, we can access the value by places 0,1 and 2. Let’s see how we can access the value of the above-mentioned code.
<html>
<head>
<title>Array in JavaScript</title>
</head>
<script type="text/javascript">
var characters = ["AB", "CD", "XY"];
alert(characters); // output will be AB,CD,XY
alert(characters[0]); // output will be AB
</script>
<body>
</body>
</html>
Print Array of String Using for Loop:
<html>
<head>
<title>Array in JavaScript</title>
</head>
<script type="text/javascript">
var characters = ["AB", "CD", "XY"];
for(var i=0; i<3; i++){
alert(characters[i]); // this will alert value one by one.
}
</script>
<body>
</body>
</html>
The above code will alert all the values one by one.
2. String Array as An Object
This is a type of array that uses the object of key-value pairs.
Declaration:
var objectArray = {0: "1", 1: '2', 2: 'Mess',3: 'empty string'};
This is a pair of array of key and value. If we want to use the 0 place value we can access this by using objectArray[0].
<html>
<head>
<title>Array in JavaScript</title>
</head>
<script type="text/javascript">
// String array as an object
var objectArray = {0: "1", 1: '2', 2: 'Mess',3: 'empty string'};
alert(objectArray [0]); // this will print 1
alert(objectArray [1]); // this will print 2
alert(objectArray [2]); // this will print Mess
alert(objectArray [3]); // this will print empty string
</script>
<body>
</body>
</html>
Using this approach we can assign any key not 0, 1, 2, etc. We can go for any string as well. Let’s see it with an example.
<html>
<head>
<title>Array in JavaScript</title>
</head>
<script type="text/javascript">
// String array as an object
var objectArray = {"first": "1", "second": '2', 2: 'Mess',3: 'empty string'};
alert(objectArray ['first']); // this will print 1
alert(objectArray ['second']); // this will print 2
alert(objectArray [2]); // this will print Mess
alert(objectArray [3]); // this will print empty string
</script>
<body>
</body>
</html>
We can see we have used first and second for the 0 and 1 position key. The output remains the same as was in the previous example. To access first element value we will use objectArray[‘first’]).
Now, let’s see what will be the output of the below code:
<html>
<head>
<title>Array in JavaScript</title>
</head>
<script type="text/javascript">
// String array as an object
var objectArray = {"first": "1", "second": '2', 2: 'meaow',3: 'empty string'};
alert(objectArray [0]); // this will print undefined
</script>
<body>
</body>
</html>
Since there is no key with 0 is defined, the output of the above code will be undefined.
Function on A String Array
Function on A String Array is given below,
join() function
This will concatenate the string array element together with the specified separator. The below code will join the array elements with the pipeline operator (|).
<script type="text/javascript">
var characters = ["AB", "CD", "XY"];
var outputstring = characters.join(" | ");
alert(outputstring);
</script>
The output of the above code will be – AB | CD | XY
concat() function
we can use this function to join two arrays.
<script type="text/javascript">
var characters1 = ["AB", "CD", "XY"];
var characters2 = ["AB", "CD", "XY"];
var characters = characters1.concat(characters2);
alert(characters);
</script>
The output of the above code will be – AB,CD,XY,AB,CD,XY
includes() function
This function will return the boolean value (true or false). If a specified string exists in an array then it will return true otherwise it will return false. Let’s see the same with an example.
<script type="text/javascript">
var characters1 = ["AB", "CD", "XY"];
var characters = characters1.includes("CD");
alert(characters); // true
var characters = characters1.includes("CDA"); // false
alert(characters); // true
</script>
split() function
this function will take the string as an input and will split that to the array. Let’s see the same with an example.
<script type="text/javascript">
var str = "Welcome to the JavaScript Blogging!";
var result = str.split(" ");
alert(result[0]); // this will print Welcome
alert(result); // this will print Welcome,to,the,JavaScript,Blogging!
</script>
Conclusion
JavaScript support various types of array we can go for. We need not worry about the data type while using the JavaScript string array. We should include the array of string in our routine as a developer to deal with the coding kinds of stuff. String array we can use where we are not sure about kinds of data we will be stored at the run time. So, we can say that the string array in a hybrid array as it can combine various types of data value. Like we can store integers, characters or any other string.
Now, it’s time to test yourself
- By default, the array indexing starts from 0. True or False?
- In JavaScript need not to define the data type at the time of the Array declaration. True or False?
- Most of the JavaScript array functions remains the same for String array. True or False?
- Write a program in JavaScript to use the string function to get all string concatenated by the semicolon?
Recommended Articles
This is a guide to String Array in JavaScript. Here we discuss function and type of array in javascript with an example which includes traditional array, string array as an object. You may also look at the following articles to learn more –