javaScript map(), filter(), reduce()의 폴리필

모든 온라인 브라우저에서 원활하게 실행되는 브라우저 간 호환 웹 프로그램을 원하지 않는 사람이 누가 있겠습니까? 그러나 JavaScript에 점점 더 많은 새로운 기능이 추가됨에 따라 많은 오래된 💨 브라우저가 더 이상 모든 기능을 지원하지 않습니다.

Polyfills는 문제에 대한 해결책입니다.💫💥

폴리필이란 무엇입니까?

아직 네이티브 지원이 없는 이전 브라우저의 최신 기능에 대한 지원을 추가하기 위해 polyfill이라는 코드 조각이 사용됩니다.
예를 들어, 언어 반복의 일부로 JavaScript가 x라는 새로운 함수를 릴리스한다고 💭 가정해 봅시다. 이제 이 기능은 모든 이전 브라우저에서 지원되지 않을 수 있습니다. 그러나 개발자로서 우리는 앱이 모든 브라우저에서 작동하는 것을 선호합니다. 맞춤형 코드를 사용하는 폴리필은 이를 달성할 수 있도록 도와줍니다.

지도용 폴리필()

맵의 구문--> array.map((num,i,arr)=>{})myMap이라는 고유한 지도 메서드를 만들어 봅시다.

myMap()은 콜백/함수인 매개변수를 사용합니다.

myMap 함수에 의해 반환되는 임시 배열이 있습니다.

'콜백'에서 반환된 값은 임시로 푸시됩니다.
정렬.

여기서 this는 이 myMap을 사용할 배열입니다.
기능을 켜십시오.
전통적인 map() 콜백은 요소, 인덱스 및 소스 배열의 3가지 인수를 사용할 수 있습니다. 우리도 똑같이 했습니다.

//Creating custom Map
Array.prototype.myMap= function(callback){
    let temp=[];
    for(let i=0;i<this.length;i++)
    {
        temp.push(callback(this[i],i,this));
    }
    return temp;
};
//Performing map method through custom made map called myMap
const nums=[1,2,3,4];
const multiply=nums.myMap((x)=>{
    return x*2;
})
console.log(multiply);

필터용 폴리필()

필터의 구문--> array.filter((num,i,arr)=>{})myFilter라는 자체 필터 메서드를 만들어 보겠습니다.

myFilter()는 콜백/함수인 매개변수를 취합니다.

끝에 반환되는 임시 배열이 있습니다.

콜백에서 반환된 값은 임시로 푸시됩니다.
정렬.

여기서 this는 우리가 이 myFilter를 사용할 배열입니다.
기능을 켜십시오.

기존의 filter() 콜백은 3개의 인수를 사용할 수 있습니다. 요소,
인덱스 및 소스 arr. 우리도 똑같이 했습니다.

//Creating custom filter
Array.prototype.myFilter=function(callback){
    let temp=[];
    for(let i=0;i<this.length;i++)
    {
        if(callback(this[i],i,this))
            temp.push(this[i]);
    }
    return temp;
}
//Performing filter method through custom made filter called myFilter
const nums=[1,2,3,4];
const FilterOdd=nums.myFilter((x)=>{
   return x%2;
})
console.log(FilterOdd);

reduce()용 폴리필

감소의 구문--> array.reduce((num,i,arr)=>{})reduce() 메서드는 배열의 각 요소에 대해 (귀하가 제공하는) 리듀서 함수를 실행하여 단일 출력 값을 생성합니다.

두 가지 중요한 매개 변수를 사용합니다.
누산기(acc) 및 initial_value
myReduce()라는 자체 reduce() 메서드를 만들어 보겠습니다.

myReduce()는 콜백/함수인 매개변수를 취합니다.

감소된 단일 값을 반환합니다.

cb에서 반환된 값은 acc에 할당됩니다.

여기서 this는 우리가 이 myReduced를 사용할 배열입니다.
기능을 켜십시오.

기존의 reduce() 콜백은 4개의 인수를 사용할 수 있습니다. 축전지,
initial_value, index 및 소스 arr. 우리도 똑같이 했습니다.

//Creating custom reduce
Array.prototype.myReduce=function(callback,initial_value){
    var acc=initial_value;
    for(let i=0;i<this.length;i++)
    {
        acc=acc?callback(acc,this[i],i,this):this[i];
    }
    return acc;

}
//Performing reduce method through custom made reduce called myReduce
const nums=[1,2,3,4];
const sum=nums.myReduce((acc,curr,i,nums)=>{
   return acc+curr;
},0);
console.log(sum)

나는 여전히 Polyfills를 배우고 있습니다. 이 블로그가 당신에게 그들이 무엇인지에 대한 적절한 소개를 해주기를 바랍니다.
질문이 있으시면 의견 섹션에 알려주십시오. 나는 그들에게 대답하기 위해 최선을 다할 것입니다.
이 블로그가 도움이 되셨다면 좋아요 ❤️ 부탁드립니다.
그런 놀라운 것들을 배우고 싶다면 저를 팔로우하세요.