জাভাস্ক্রিপ্ট: .forEach () এবং .map () এর মধ্যে পার্থক্য

116

আমি জানি যে এখানে অনেকগুলি বিষয় ছিল। এবং আমি বেসিকগুলি জানি: .forEach()মূল অ্যারে এবং নতুনটিতে কাজ করে .map()।

আমার ক্ষেত্রে:

function practice (i){
    return i+1;
};

var a = [ -1, 0, 1, 2, 3, 4, 5 ];
var b = [ 0 ];
var c = [ 0 ];
console.log(a);
b = a.forEach(practice);
console.log("=====");
console.log(a);
console.log(b);
c = a.map(practice);
console.log("=====");
console.log(a);
console.log(c);

এবং এটি আউটপুট:

[ -1, 0, 1, 2, 3, 4, 5 ]
=====
[ -1, 0, 1, 2, 3, 4, 5 ]
undefined
=====
[ -1, 0, 1, 2, 3, 4, 5 ]
[ 0, 1, 2, 3, 4, 5, 6 ]

আমি বুঝতে পারছি না কেন ব্যবহার practiceপরিবর্তনের মূল্য bথেকে undefined।
আমি যদি এই নির্বোধ প্রশ্ন হয় তবে আমি দুঃখিত, তবে আমি এই ভাষায় বেশ নতুন এবং আমি এখনও পাওয়া উত্তরগুলি আমাকে সন্তুষ্ট করেনি।

— DzikiChrzan
সূত্র

49

এটি এই সহজ: .map একটি নতুন অ্যারে প্রদান করে , যেখানে .forEach কোনও কিছুই ফেরায় না । মূলত, আপনি যদি পূর্ববর্তী অ্যারের পরিবর্তিত ফর্মটি পেতে চান তবে আপনি ব্যবহার করেন .map, যদি আপনি এটি না চান তবে আপনি ব্যবহার করুন .forEach।

— user4642212

1

প্রতিটি পদ্ধতির জাভাস্ক্রিপ্ট কী ব্যবহারের

— user4642212

@ শুফফক্স - নতুন একটি তৈরি করার আগে আমি এই বিষয়টিকে লাল করেছিলাম, তবে উত্তর আমাকে সন্তুষ্ট করেনি।

— DzikiChrzan

কেবল এটি বলবেন না যে এটি আপনাকে সন্তুষ্ট করেনি। কীভাবে এটি আপনার প্রশ্নের উত্তর দেয় না (আপনি কি সমস্ত উত্তর পড়েছেন?)? আপনার নির্দিষ্ট প্রশ্নটি কী যা প্রস্তাবিত সদৃশ লক্ষ্য দ্বারা আচ্ছাদিত নয়?

— user4642212

@ Xufox এই প্রশ্নটি স্ব-বাস্তবায়িত ফাংশনগুলির সাথে সম্পর্কিত, এবং মানক ES5 ফাংশন সম্পর্কে সত্যই নয়।

— অকর্মা

146

তারা এক এবং এক নয়। আমি পার্থক্য ব্যাখ্যা করুন।

forEach: এটি একটি তালিকার উপরে পুনরাবৃত্তি করে এবং প্রতিটি তালিকার সদস্যের পার্শ্ব প্রতিক্রিয়া সহ কিছু অপারেশন প্রয়োগ করে (উদাহরণস্বরূপ: প্রতিটি তালিকা আইটেমটি ডাটাবেসে সংরক্ষণ করা)

map: এটি একটি তালিকার উপরে পুনরাবৃত্তি করে, সেই তালিকার প্রতিটি সদস্যকে রূপান্তরিত করে এবং রূপান্তরিত সদস্যদের সাথে একই আকারের অন্য একটি তালিকা ফেরত দেয় (উদাহরণস্বরূপ: স্ট্রিংগুলির তালকে বড় হাতের দিকে রূপান্তরকরণ)

তথ্যসূত্র

অ্যারে.প্রোটোটাইপ.ফোরেচ () - জাভাস্ক্রিপ্ট | MDN

অ্যারে.প্রোটোটাইপ.ম্যাপ () - জাভাস্ক্রিপ্ট | MDN

— রিচার্ড হ্যামিল্টন
সূত্র

5

এবং এক্সুফক্স যেমন বলেছিল - .এফ প্রতিটি কিছুই ফিরিয়ে দেয় না, এটাই ঘটনা। সাহায্যের জন্য ধন্যবাদ! আমি এই উত্তরটি 10 মিনিটের মধ্যে চিহ্নিত করব।

— DzikiChrzan

1

মানচিত্রের রিটার্নের তালিকা এবং প্রত্যেকের জন্য নয়। ঠিক আছে

— আশাদ নাসিম

62

Array.forEach "অ্যারের উপাদান অনুসারে একবার সরবরাহিত ফাংশন সম্পাদন করে।"
Array.map "এই অ্যারের প্রতিটি উপাদানগুলিতে সরবরাহ করা ফাংশন কল করার ফলাফল সহ একটি নতুন অ্যারে তৈরি করে।"

সুতরাং, forEachআসলে কিছুই ফেরত না। এটি কেবল প্রতিটি অ্যারে উপাদানগুলির জন্য ফাংশনটি কল করে এবং তারপরে এটি সম্পন্ন হয়। সুতরাং আপনি যে ডাকা ফাংশন মধ্যে কিছু ফিরে আসবে সহজভাবে বাতিল করা হয়।

অন্যদিকে, mapএকইভাবে প্রতিটি অ্যারে উপাদানটির জন্য ফাংশনটি কল করবে তবে তার ফেরতের মানটি বঞ্চিত করার পরিবর্তে এটি এটি ক্যাপচার করবে এবং সেইগুলি ফেরত মানগুলির একটি নতুন অ্যারে তৈরি করবে।

এর অর্থ হ'ল আপনি যেদিকেই ব্যবহার করছেন mapসেখানে আপনি ব্যবহার করতে পারেন forEachতবে আপনার এখনও এটি করা উচিত নয় যাতে আপনি কোনও উদ্দেশ্য ছাড়াই ফেরতের মান সংগ্রহ না করেন। আপনার যদি তাদের প্রয়োজন না হয় তবে এগুলি সংগ্রহ না করা কেবল আরও দক্ষ।

— অকর্মা
সূত্র

দ্রষ্টব্য: ২০১৫ সালে, এটি বিতর্কিত forEachহতে পারত যা " পুরানো ব্রাউজারে (আই 8 বা 9) mapসমর্থন forEachকরার জন্য বিশেষত যদি পলিফিলের প্রয়োজন হয় তার চেয়ে" আরও কার্যকর "হত । mapআপনাকে কোনও কিছুর রিটার্ন বরাদ্দ করতে হবে না ; রিটার্নের মূল্য নির্ধারিত না mapহলে রিটার্নের সাথে সাথে ফেরত মানটি আবর্জনা সংগ্রহ করা উচিত map।

— কউবার্ট

3

@ আপোকার্ট কেবল যেহেতু কিছু অবিলম্বে আবর্জনা সংগ্রহ করা হয়, এর অর্থ এই নয় যে প্রয়োজনীয় বরাদ্দগুলির দ্বারা আপনি ক্ষতিগ্রস্থ হচ্ছেন না। তাই forEachহবে ধারণার দিক থেকে এখনও আরও দক্ষ এবং ভাল কাজগুলো যেখানে আপনি সংগ্রহ ফলাফলে প্রয়োজন হবে না জন্য উপযুক্ত হবে। এবং আমি আপনার সম্পর্কে জানি না তবে ২০১৫ সালে আমি আইই 8 এর পক্ষে আর বিকাশ করছিলাম না (যা বিটিডব্লিউও সমর্থন করে না map); এবং IE9 + সমর্থন forEach। এবং আসলে আমার উত্তর দেওয়ার এক মাস পরে মাইক্রোসফ্ট those ব্রাউজারগুলির সমর্থন সমর্থন করে support

— অকর্মা

উভয় এবং মানচিত্র উভয়ই একই ক্রমে উপাদানগুলি প্রক্রিয়া করার গ্যারান্টিযুক্ত?

— কোয়ান্টিন 2

1

@ Quentin2 হ্যাঁ, এছাড়াও, উভয় কর্ম সমলয়, তাই mapএবং forEachএকবার পুরো অ্যারে মাধ্যমে কর্তিত করা হয়েছে এবং কলব্যাক প্রত্যেকের জন্য বলা হয়েছে কল শুধুমাত্র ফিরে আসবে।

— অকর্মা

25

+ + ---------------- + + -------------------------------- ----- + + --------------------------------------- + +
| | foreach | মানচিত্র |
+ + ---------------- + + -------------------------------- ----- + + --------------------------------------- + +
| কার্যকারিতা | প্রতিটি উপর দেওয়া অপারেশন সঞ্চালন | "দেওয়া" রূপান্তর "সম্পাদন করে
| | অ্যারের উপাদান | প্রতিটি উপাদান "অনুলিপি" |
+ + ---------------- + + -------------------------------- ----- + + --------------------------------------- + +
| ফেরতের মান | অপরিবর্তিত | ট্রান্সফর্মড সহ নতুন অ্যারে ফেরত দেয়
| | | উপাদানগুলি মূল অ্যারে ছেড়ে চলেছে |
| | | অপরিবর্তিত |
+ + ---------------- + + -------------------------------- ----- + + --------------------------------------- + +
| পছন্দসই | মতন-রূপান্তর সম্পাদন করা | আউটপুট সমেত অ্যারে অর্জন করা
| ব্যবহারের দৃশ্য | প্রতিটি উপাদান প্রক্রিয়াজাতকরণ। | প্রতিটি উপাদান উপর কিছু প্রক্রিয়াজাতকরণ |
| এবং উদাহরণ | | অ্যারের। |
| | উদাহরণস্বরূপ, | এ সমস্ত উপাদান সংরক্ষণ করা |
| | ডাটাবেস | উদাহরণস্বরূপ, | এর অ্যারে প্রাপ্ত করা
| | | | প্রতিটি স্ট্রিংয়ের দৈর্ঘ্য |
| | | অ্যারে |
+ + ---------------- + + -------------------------------- ----- + + --------------------------------------- + +

— Mahesha999
সূত্র

দয়া করে আপনার পোস্টটি সম্পাদনা করুন এবং চিত্রগুলির পরিবর্তে প্রকৃত পাঠ্যটি দেখান। অন্যরা আপনার চিত্র থেকে অনুলিপি এবং পেস্ট করতে পারে না, বা আপনার চিত্রের মধ্যে অনুসন্ধান করতে পারে না বা চিত্রের পাঠ্য সামগ্রীটি উন্নত করতে সহায়তা করতে পারে। বিশদ জন্য এখানে দেখুন । ধন্যবাদ.

— পাইং

2

এটি আপনাকে ASCII আর্ট টেবিলগুলি আঁকতে সহায়তা করতে পারে: webapps.stackexchange.com/q/6700/126269

— পাং

16

আপনার যে প্রধান পার্থক্যটি জানতে হবে তা হ'ল .map()একটি নতুন অ্যারে প্রদান .forEach()করে। যে কারণে আপনি আউটপুট মধ্যে পার্থক্য দেখতে। .forEach()অ্যারেতে প্রতিটি মান চালিত করে।

পড়া:

আপনি এটিও দেখতে চাইতে পারেন: - Array.prototype.every()- জাভাস্ক্রিপ্ট | MDN

— রাহুল দেশাই
সূত্র

7

forEach: আপনি যদি অ্যারের উপাদানগুলিতে কোনও ক্রিয়াকলাপ করতে চান এবং লুপের জন্য ব্যবহার করেন তবে এটি একই is এই পদ্ধতির ফলাফল আমাদের কোনও আউটপুট ক্রয়ের উপাদানগুলির মধ্য দিয়ে কেবল লুপ দেয় না।

মানচিত্র: আপনি যদি কোনও অ্যারের উপাদানগুলিতে কোনও ক্রিয়া সম্পাদন করতে চান এবং এছাড়াও আপনি আপনার ক্রিয়াটির আউটপুট একটি অ্যারেতে সঞ্চয় করতে চান। এটি কোনও ফাংশনের মধ্যে লুপের অনুরূপ যা প্রতিটি পুনরাবৃত্তির পরে ফলাফলটি দেয়।

আশাকরি এটা সাহায্য করবে.

— অমরনাথ জৈকুমার
সূত্র

5

পার্থক্য তারা ফিরে আসে কি। মৃত্যুদন্ড কার্যকর করার পরে:

arr.map()

প্রক্রিয়াজাত ফাংশন থেকে প্রাপ্ত উপাদানগুলির একটি অ্যারে প্রদান করে; যখন:

arr.forEach()

অপরিবর্তিত

— গডউইন একুমা
সূত্র

5

পারফরম্যান্স অ্যানালাইসিসের জন্য লুপগুলি অ্যারেতে উপাদানগুলির সংখ্যা বৃদ্ধির সাথে সাথে মানচিত্র বা ফোরচের চেয়ে দ্রুত সম্পাদন করে।

let array = [];
for (var i = 0; i < 20000000; i++) {
  array.push(i)
}

console.time('map');
array.map(num => {
  return num * 4;
});
console.timeEnd('map');


console.time('forEach');
array.forEach((num, index) => {
  return array[index] = num * 4;
});
console.timeEnd('forEach');

console.time('for');
for (i = 0; i < array.length; i++) {
  array[i] = array[i] * 2;

}
console.timeEnd('for');

— সোনিয়া কাউশাল
সূত্র

আমার কম্পিউটারে ফলাফল এখানে:map: 1642ms forEach: 885ms for: 748ms

— ফ্ল্যাভিও ভাইলাতে

2

ফরচ এবং মানচিত্রের মধ্যে পার্থক্য:

মানচিত্র () : আপনি যদি মানচিত্র ব্যবহার করেন তবে মানচিত্রটি মূল অ্যারের পুনরাবৃত্তি করে নতুন অ্যারে ফিরিয়ে দিতে পারে।

ফরচ () : আপনি যদি ফরচ ব্যবহার করেন তবে এটি প্রতিটি অ্যারেতে পুনরায় করা মূল অ্যারেটির জন্য কিছু দিতে পারে না।

ব্যবহারফুল লিঙ্ক : ভিন্নতা বোঝার জন্য এই লিঙ্কটি ব্যবহার করুন

https://codeburst.io/javascript-map-vs-foreach-f38111822c0f

— প্রকাশ হারভানি
সূত্র

1

একটি বিষয় উল্লেখ করার জন্য হ'ল ফোরচ মানচিত্রে অবিচ্ছিন্ন মানগুলি এড়িয়ে যায়।

var arr = [1, , 3];

arr.forEach(function(element) {
    console.log(element);
});
//Expected output: 1 3

console.log(arr.map(element => element));
//Expected output: [1, undefined, 3];

— কনি ওলসন
সূত্র

0

প্রতিটি () এবং মানচিত্রের () মধ্যে পার্থক্য

forEach () কেবলমাত্র উপাদানগুলির মধ্য দিয়ে লুপ করুন। এটি প্রত্যাবর্তনের মানগুলি ছুঁড়ে ফেলে এবং সর্বদা অপরিবর্তিত থাকে this এই পদ্ধতির ফলাফল আমাদের আউটপুট দেয় না।

উপাদানগুলির মাধ্যমে মানচিত্র () লুপ মেমরি বরাদ্দ করে এবং প্রধান অ্যারের পুনরাবৃত্তি করে মানগুলি ফেরত দেয়

উদাহরণ:

   var numbers = [2,3,5,7];

   var forEachNum = numbers.forEach(function(number){
      return number
   })
   console.log(forEachNum)
   //output undefined

   var mapNum = numbers.map(function(number){
      return number
   })
   console.log(mapNum)
   //output [2,3,5,7]

মানচিত্র () forEach () এর চেয়ে দ্রুত

— রাজিব হোসেন
সূত্র

0

প্রতিটা না করে মানচিত্র সুস্পষ্টভাবে ফিরে আসে।

এ কারণেই আপনি যখন কোনও জেএসএক্স অ্যাপ্লিকেশন কোডিং করছেন, আপনি প্রায়শই প্রতিক্রিয়াতে সামগ্রী প্রদর্শন করার জন্য ফরএচের পরিবর্তে মানচিত্র ব্যবহার করেন ।

— নীথান বদিয়া
সূত্র

0

জন্য প্রতিটি () :

ফেরত মান: undefined

অরিজিনাল অ্যারে: পদ্ধতি কলের পরে সংশোধিত

মানচিত্র () :

রিটার্ন মান: নতুন অ্যারে কলিং অ্যারেতে প্রতিটি উপাদানগুলিতে সরবরাহ করা ফাংশন কল করার ফলাফলের সাথে জনবহুল

অরিজিনাল অ্যারে: পদ্ধতি কলের পরে সংশোধিত হয়নি

— হর্ষ বর্ধন চাক্কা
সূত্র