JS — spread Array, isArray(),filter,match,map,replace, regex

  • filter(callback(value,index)) — 걸러내다
  • undefined가 포함된 array를 아래와 같이 filter 할 경우 ,
  • undefined, null, 빈값은 제외하고 값만 반환시킨다.
var fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];

* Array filters items based on search criteria (query)
function filterItems(query) {
return fruits.filter(function(el) {
return el.toLowerCase().indexOf(query.toLowerCase()) > -1;

console.log(filterItems('ap')); // ['apple', 'grapes']
var ages = [32, 33, 16, undefined];function checkAdult(age) {
return !!age;
function myFunction() {
document.getElementById("demo").innerHTML = ages.filter(checkAdult); // 32,32,16
var str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
var regexp = /[A-E]/gi;
var matches_array = str.match(regexp);

// ['A', 'B', 'C', 'D', 'E', 'a', 'b', 'c', 'd', 'e']
// Say I have
var array = [1, 2, 3, 4, 5, 6];

// I can use `filter` to get an array of just odd numbers:
var odds = array.filter(function(entry) { return entry % 2 == 1; });
console.log("odds: " + odds);

// I can use `map` to get an array of those numbers doubled:
var doubles = array.map(function(entry) { return entry * 2; });
console.log("doubles: " + doubles);
  • filter returns an new array of skip unwanted elements of collection ( 원하지 않는 대상 제외, 비교 조건 검사, 문자비교)
  • map returns an new array of modifying elements of collection.
  • What is different is that filter() expects that function to return Boolean value based on which element will be skipped or not. map() will expect that function to return an new collection element.
str.replace(regexp|substr, newSubstr|function)
var str = "Mr Blue has a blue house and a blue car";
var res = str.replace(/blue/g, "red");
//Regexvar re = /ab+c/;orvar re = new RegExp('ab+c');




Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

A Brief Overview of Order of Execution in JavaScript

FantomStarter Tier upgrades are now here!

How To Make Light/Dark Mode Theme For Your Website Using SCSS

Spring Boot — JWT Token based resource authentication & JavaMailSender

Pruning your code — Part 2

Implement linear regression in React

React’s useEffect Hook

React’s useEffect Hook

How to Integrate Stand-Alone React Components on a Static Page

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store


More from Medium

Implementing JavaScript Stack

Stack of books

ReactJS useEffect hooks and Singleton Keycloak JS client

Rotate array element in JavaScript

Javascript for application Development — (Stands of development, Introduction to javascript )