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 non-null/undefined argument in JavaScript?
In JavaScript, there are often times when we need to find the first non-null/undefined argument in a function. This can be a tricky task, but luckily there are a few methods that can help us accomplish this
Using Array.prototype.find()
One method that can be used to get the first non-null/undefined argument in JavaScript is the Array.prototype.find() method. This method returns the value of the first element in an array that passes a given test. In our case, we can use this method to find the first non-null/undefined argument by passing a test that checks if the argument is not null/undefined.
Example
In the example below, we define a function to find the first non-null or undefined argument.
<html>
<head>
<title>Example: finding first non-null arguements</title>
</head>
<body>
<h2> Array.prototype.find() Method</h2>
<div id="arguments"></div>
<div id="result"></div>
<script>
function findFirstNonNullArgument(...args) {
return args.find(arg => arg != null);
}
var result = findFirstNonNullArgument(null, undefined, "Hello", "World");
document.getElementById("arguments").innerHTML = `Arguments: null, undefined, "Hello", "World"`;
document.getElementById("result").innerHTML = "<br>First Non-Null Argument: " + result;
</script>
</body>
</html>As we can see from the code above, the findFirstNonNullArgument() function takes in a variable number of arguments and uses the find() method to return the first non-null/undefined argument.
Using Array.prototype.filter()
Another method that can be used to get the first non-null/undefined argument in JavaScript is the Array.prototype.filter() method. This method creates a new array with all elements that pass the given test. In our case, we can use this method to find the first non-null/undefined argument by passing in a test that checks if the argument is not null/undefined.
Example
Below is the full working code.
<html>
<head>
<title>Example: finding first non-null arguements</title>
</head>
<body>
<h2> Array.prototype.filter() Method</h2>
<div id="arguments"></div>
<div id="result"></div>
<script>
function findFirstNonNullArgument(...args) {
return args.filter(arg => arg != null)[0];
}
document.getElementById("arguments").innerHTML = `Arguments: null, undefined, "Hello", "World"`;
document.getElementById("result").innerHTML = "<br>First non-nul argument: " + findFirstNonNullArgument(null, undefined, "Hello", "World")
</script>
</body>
</html>As we can see from the code above, the findFirstNonNullArgument() function takes in a variable number of arguments and uses the filter() method to return the first non-null/undefined argument.
Using a for loop
Another method that can be used to get the first non-null/undefined argument in JavaScript is by using a for loop. This method loops through all of the arguments and checks if each argument is not null/undefined. If it finds an argument that is not null/undefined, it returns that argument.
Example
Below is the full working code −
<html>
<head>
<title>Examples</title>
</head>
<body>
<div id="result"></div>
<script>
function findFirstNonNullArgument(...args) {
for (let arg of args) {
if (arg != null) {
return arg;
}
}
}
document.getElementById("result").innerHTML = findFirstNonNullArgument(null, undefined, "Hello", "World")
</script>
</body>
</html>As we can see from the code above, the findFirstNonNullArgument() function takes in a variable number of arguments and uses a for loop to return the first non-null/undefined argument.
Conclusion
In this article, we looked at three different methods that can be used to get the first non-null/undefined argument in JavaScript. Each method has its own advantages and disadvantages, so it is important to choose the right method for the task at hand.
3K+ Views
