-3

I have this array

let arr = [ 'file_1.jpg' , 'file_2.png', 'file_3.pdf', 'file_4.html', 'folder.db' ]

I want to filter the files that has .jpg and .png on it. 

arr.filter() // desired output: [ 'file_1.png','file_2.png' ]
Ori Drori
  • 183,571
  • 29
  • 224
  • 209
Marven Wilson S Donque
  • 275
  • 1
  • 4
  • 14
  • 4
    Google "how to filter an array in JavaScript": https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter You even used the correct function name in your example... – msanford Oct 31 '17 at 20:49
  • 3
    Possible duplicate of [How to filter an array in javascript?](https://stackoverflow.com/questions/45916135/how-to-filter-an-array-in-javascript) – msanford Oct 31 '17 at 20:51
  • 3
    So many answers, so little VTC as duplicate – Alon Eitan Oct 31 '17 at 20:52
  • 1
    What's with all then downvotes? Why so much noob bashing on this site? – darksky Oct 31 '17 at 20:53
  • 1
    @darksky Because it shows _absolutely zero research effort,_ please see [How much research effort is expected of Stack Overflow users?](https://meta.stackoverflow.com/questions/261592/how-much-research-effort-is-expected-of-stack-overflow-users) Questions do not get down-voted for being from noobs, _everyone starts somewhere._ They get down-voted and closed because they are not suitable for SO. There is a minimum effort expected before posting. Also, having 10 exact duplicate questions pollutes the site with noise: the whole idea is to have a single authoritative answer for a given case. – msanford Oct 31 '17 at 20:54

4 Answers4

3
arr.filter(link => link.endsWith(".png") || link.endsWith(".jpg"));
Niklas Higi
  • 2,188
  • 1
  • 14
  • 30
2

Filter with a RegExp:

const arr = [ 'file_1.jpg' , 'file_2.png', 'file_3.pdf', 'file_4.html', 'folder.db' ];

const pattern = /\.(png|jpg)$/; // string should end with .png or .jpg
const result = arr.filter((name) => pattern.test(name));

console.log(result);
Ori Drori
  • 183,571
  • 29
  • 224
  • 209
1
 const result = arr.filter( link => link.endsWith(".png") || link.endsWith(".jpg"));
cdaiga
  • 4,861
  • 3
  • 22
  • 42
0

Filter Function

The filter function accepts one callback function which returns a boolean for each item of the list.

So you could create a function that is using a regular expression to check if a string is a png or jpg.

Creating the filtering expression

  • In JavaScript regular expressions look like this: //
  • The dot is a special character (match any character) so you need to escape it: /\./
  • To match a string from a collection of strings you can use () and separate the options using a pipe (|): /\.(jpg|png)/
  • You can check if that is the end of text by adding $ at the end: /\.(jpg|png)$/

Then using the test function you can check if a string matches your expression.

arr.filter(isJPEG);

function isJPEG(text) {
    return /\.(jpg|png)$/.test(text);
}

Working Example

var arr = ['file_1.jpg', 'file_2.png', 'file_3.pdf', 'file_4.html', 'folder.db'];

var filteredList = arr.filter(isJPEG);

console.log(JSON.stringify(filteredList));

function isJPEG(text) {
    return /\.(jpg|png)$/.test(text);
}
nick zoum
  • 7,216
  • 7
  • 36
  • 80