JavaScript에서 새로운 기능을 만드는 이유

Question

코드 스쿨의 JavaScript로드 트립을 살펴 보았습니다.이 스크립트는 매우 유용하며, JavaScript 학습이 실제로 나를 위해 더 의미있게 만드는 것으로 보입니다. 나는 운이 많이없이이 전에 여러 권의 책을 시험해 보았습니다.

어쨌든, 질문에; 다음을 고려하십시오 :

var fruits = ["Apple", "Orange", "Pineapple", "Cranbery", "Pomegranate" ]; 
var fruitJuice = fruits.map(function (fruit) {return "\n" + fruit + " juice";}); 
alert(fruitJuice); 

맵 기능으로 '과일'이라는 새로운 변수를 만드는 이유는 무엇입니까? 나는 jsfiddle에서 놀았으며, 내용을 변경하지 않고 원래의 'fruits'배열을 사용할 수있었습니다. 그래서 예를 들면

: 또한 잘 작동하지만 시작에 같은 과일 변수를 사용

var fruits = ["Apple", "Orange", "Pineapple", "Cranbery", "Pomegranate" ]; 
var fruitJuice = fruits.map(function (fruits) {return "\n" + fruits + " juice";}); 
alert(fruitJuice); 

.

이 모범 사례입니까, 아니면 여기에서 중요한 것을 놓치고 있습니까?

도움 주셔서 감사합니다.

Answer 1

var fruitJuice = fruits.map(function (fruit) {return "\n" + fruit + " juice";}); 

이것은 분명히 익숙하지 않은 개념입니다. 무엇 map하는 일은 기본적으로이 (간체 설명)입니다 :

var result = []; 
for (var i = 0; i < fruits.length; i++) { 
    result.push(callback(fruits[i])); 
} 
return result; 

map 제공된 callback 함수로 전달의 fruits 배열의 각 항목을 취하고 무엇이든 그 함수가 반환됩니다. 그래서 콜백 함수는 다음과 같습니다

여기

function (fruit) {return "\n" + fruit + " juice";} 

fruit은 함수에 대한 매개 변수, 즉 fruits[i]입니다. 매개 변수를 참조하려면 매개 변수의 이름을 어떻게 든 지정해야합니다. 물론 함수 내부의 다른 변수에 액세스 할 수 있지만 fruit은 map에 의해 전달 된 고유 한 배열 요소입니다.

Answer 2

새 변수 과일을 만들면 변수가 함수 자체에서 인스턴스화됩니다. hello + name에 경고하여 이름을 지정한다고 가정 해 보겠습니다. 이처럼 할 수있는 :

var Name = 'bob'; 
alert('hello ' + Name); 

그러나 우리는 또한 다른 이름으로 나중에 코드에서 사용할 수있는 가능성을을 제공하는이처럼 그것을 할도 수있다.

function sayHello(Name) { alert("Hello " + Name); } 

var Name = 'Bob'; 
var Name2 = 'John'; 

sayHello(Name); 
sayHello(Name2); 
sayHello('Jack'); 

이렇게하면 3 개의 알림이 Hello 밥과 함께 표시되고 나머지는 Hello John 및 Hello Jack이 표시됩니다. 함수 안에서도 함수 내부에서 변수의 값을 사용하지만 함수 내부에서 호출하지 않고 똑같은 일을합니다.

.map 함수를 사용하면 배열에서 모든 값을 가져 와서 함수 내에 배치합니다. 그래서 나는 이와 비슷한 것을 할 수 있습니다.

var Names = ['Bob', 'John', 'Jack']; 

Names.map(sayHello(Names)); 

이렇게하면 함수 내에서 콜백 변수로 name을 사용하여 거의 동일한 방식으로 이름이 인쇄됩니다. 안녕하세요. Bob, John, Jack.

Answer 3

지도 2 방법 (원본지도 방법으로)은 새 배열을 만들고 매개 변수가 필요합니다. 콘솔을 보면
당신은이 방법이

Array.prototype.map2=function(callback){ 
     var result=[] 
     console.log(this) 
     console.log(callback) 
     console.log(callback(this[0])) 
     result.push(callback(this[0])) 
     for (var i = 0; i < this.length; i++) { 
      result.push(callback(this[i])); 
     } 
     return result 
    } 
    var arr=["Apple", "Orange", "Pineapple", "Cranbery" ] 
    console.log(arr.map2(function(a){return "a " + a + " juice"})) 
    /*console.log(["Apple", "Orange", "Pineapple", "Cranbery" ].map2(function(b){return 'big'+b}))*/