Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to get the first n values of an array in JavaScript?
In this article we are going to discuss how to get the first n values of an array using JavaScript.
First, n value − to find the elements from the first index to n (n is the given number or given index) suppose you have given the n value as 5 the returned elements will be from index 0 to 5.
Using the _.first() function
To get the first n elements of an array we have many logical methods. But underscore.js provides the _.first() function. Which will directly or in a simple way gives the output.
Note − if we did not mention the n value in the _.first() function then it will be returned as the first element of an array. Following is the syntax of the _.first() function −
_.first(array,n)
It takes the array and a number as a parameter so, it will give the first n value from the array and returns the first n elements of an array as output.
Example: 1
In the following example, we are passing an integer array in _.first() function −
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>
</head>
<body>
<script type="text/javascript">
var array = [1, 2, 3, 4, 5, 6, 7];
document.write(_.first(array, 4));
</script>
</body>
</html>
Example 2
Let us see another example for this −
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Get the first n values from an array</title>
<script src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/0.10.0/lodash.min.js"></script>
<div id="first"></div>
</head>
<body>
<script>
let arr = new Array("Alice", 40, "Edward", "Cullen");
let n = 2;
document.getElementById("first").innerHTML =
"First n elements from an array is : " + _.first(arr, n);
</script>
</body>
</html>
Using the slice() method
Using the slice method you can get the elements in the selected range in the new array the syntax of the slice() method is −
arr.slice(0,n);
Example 1
The following example demonstrates to get first n elements of an array using the slice() method in JavaScript.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Get the first n values from an array</title>
<div id="slice"></div>
</head>
<body>
<script>
let arr = new Array("Alice", 40, "Edward", "Cullen");
let n = 2;
let firstN = arr.slice(0, n);
document.getElementById("slice").innerHTML ="First n elements from an array is : " + firstN;
</script>
</body>
</html>
Example 2
In the following example, the slice() method in JavaScript is used to get first n elements of an array.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Get the first n values from an array</title>
<div id="slice"></div>
</head>
<body>
<script>
let n = 3;
let getFirstN = function (...arr) {
let sliceArr = arr.slice(0, n);
return sliceArr;
};
document.getElementById("slice").innerHTML =
"First n elements from an array is : " +
getFirstN("Alice", 40, "Edward", "Cullen");
</script>
</body>
</html>
844 Views
