ECMAScript 6 টি তীর ফাংশন যা কোনও অবজেক্টকে ফেরত দেয়


619

একটি তীর ফাংশন থেকে কোনও জিনিস ফেরত দেওয়ার সময় মনে হয় ব্যাকরণে দ্বিধাগ্রস্থতার কারণে অতিরিক্ত সেট {}এবং returnকীওয়ার্ড ব্যবহার করা প্রয়োজন ।

তার মানে আমি লিখতে পারি না p => {foo: "bar"}, তবে লিখতে হয় p => { return {foo: "bar"}; }

তীর ফাংশন কিছু ফেরৎ একটি বস্তু চেয়ে পারেন, {}এবং returnযেমন অপ্রয়োজনীয় হয়,: p => "foo"

p => {foo: "bar"}আয় undefined

একটি পরিবর্তিত p => {"foo": "bar"}নিক্ষেপ " SyntaxError: অপ্রত্যাশিত টোকেন: ' :'"

আমি কি অনুপস্থিত কিছু স্পষ্টত আছে?

উত্তর:


1108

আপনাকে অবশ্যই রিটার্নিং অবজেক্টটি আক্ষরিকভাবে প্রথম বন্ধনীতে আবৃত করতে হবে। অন্যথায় কোঁকড়ানো ধনুর্বন্ধনীগুলি ফাংশনটির শরীর বোঝাতে বিবেচিত হবে। নিম্নলিখিত কাজগুলি:

p => ({ foo: 'bar' });

আপনার অন্য কোনও এক্সপ্রেশনকে প্রথম বন্ধনীতে আবৃত করার দরকার নেই:

p => 10;
p => 'foo';
p => true;
p => [1,2,3];
p => null;
p => /^foo$/;

ইত্যাদি।

তথ্যসূত্র: এমডিএন - রিটার্নিং অবজেক্ট আক্ষরিক


7
আমি উত্সাহী কেন প্যারেনরা পার্থক্য রাখে।
wrschneider

40
@Wrschneider কারণ প্যারেন্স ছাড়াই জেএস পার্সার মনে করে যে এটি কোনও ফাংশন বডি, কোনও অবজেক্ট নয়, এবং
ফুও

21
@Wrschneider আরও সুনির্দিষ্টভাবে, এএসটি নোডের ক্ষেত্রে, প্রথম বন্ধনী ব্যবহার করে একটি অভিব্যক্তি বিবৃতি বোঝায়, যেখানে কোনও বস্তুর অভিব্যক্তি উপস্থিত থাকতে পারে, অন্যদিকে ডিফল্টরূপে, কোঁকড়া ধনুর্বন্ধনী ব্লক বিবৃতি হিসাবে ব্যাখ্যা করা হয়।
প্যাট্রিক রবার্টস

5
কোন ধারণা কেন এই কাজ, কিন্তু আপনি এর মান ব্যবহার করতে চান তাহলে pবস্তুর আক্ষরিক হিসাবে কী, এই কিভাবে আপনি এটা করবেন হল: p => ({ [p]: 'bar' })। এটি ছাড়া [], এটি হয় undefinedবা আক্ষরিকভাবে চিঠিটি হবে p
ড্যানম্যান

1
@ ড্যানম্যান এটি গণিত বৈশিষ্ট্য বলা হয় এবং এটি বস্তুর আক্ষরিক বৈশিষ্ট্য।
ডি পারদল

62

আপনি ভাবতে পারেন, সিনট্যাক্সটি বৈধ কেন (তবে প্রত্যাশার মতো কাজ করছে না):

var func = p => { foo: "bar" }

এটি জাভাস্ক্রিপ্টের লেবেল সিনট্যাক্সের কারণে :

সুতরাং আপনি যদি উপরের কোডটি ES5 তে স্থানান্তরিত করেন তবে এটি দেখতে এমন হওয়া উচিত:

var func = function (p) {
  foo:
  "bar"; //obviously no return here!
}

5
লেবেলগুলি এমন কদাচিৎ ব্যবহৃত এবং রহস্যজনক বৈশিষ্ট্য। তাদের সত্যই কি কোনও মূল্য আছে? আমার মনে হয় এগুলি অবজ্ঞা করে অবশেষে অপসারণ করা উচিত।
কেনমোর

@Kenmore দেখুন stackoverflow.com/questions/55934490/... - পিছন সামঞ্জস্য। ব্রাউজারগুলি এমন কোনও বৈশিষ্ট্য প্রয়োগ করতে অস্বীকার করবে যা বিদ্যমান সাইটগুলি ভেঙে দেয়
সেরেইনট পারফরম্যান্স

@ কেনমোর লেবেলযুক্ত থাকলে নেস্ট করা লুপগুলি থেকে আপনি প্রস্থান করতে পারবেন। প্রায়শই ব্যবহৃত হয় না তবে অবশ্যই কার্যকর।
পেটর ওডুট

17

যদি তীর ফাংশনটির বডিটি কোঁকড়ানো ধনুর্বন্ধনীতে আবৃত থাকে তবে তা স্পষ্টতই ফিরে আসে না। অবজেক্টটি প্রথম বন্ধনে আবদ্ধ করুন। এটি দেখতে এমন কিছু লাগবে।

p => ({ foo: 'bar' })

পেরেন্সে দেহটি মুড়ে ফাংশনটি ফিরে আসবে { foo: 'bar }

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


2

সঠিক উপায়

  1. সাধারণ রিটার্ন অবজেক্ট

const getUser = user => {return { name: user.name, age: user.age };};

const user = { name: "xgqfrms", age: 21 };

console.log(getUser(user));
//  {name: "xgqfrms", age: 21}
  1. (জেএস এক্সপ্রেশন)

const getUser = user => ({ name: user.name, age: user.age });

const user = { name: "xgqfrms", age: 21 };

console.log(getUser(user));
//  {name: "xgqfrms", age: 21}

ব্যাখ্যা করা

ভাবমূর্তি

একই উত্তর এখানে পাওয়া যাবে!

https://github.com/lydiahallie/javascript-questions/issues/220

https://mariusschulz.com/blog/returning-object-literals-from-arrow-functions-in-javascript


1

সমস্যা:

যখন আপনি করছেন:

p => {foo: "bar"}

জাভাস্ক্রিপ্ট ইন্টারপ্রেটার মনে করে আপনি একটি মাল্টি-স্টেটমেন্ট কোড ব্লক খুলছেন, এবং সেই ব্লকে আপনাকে স্পষ্টভাবে একটি বিবরণী বিবৃতি উল্লেখ করতে হবে।

সমাধান:

যদি আপনার তীর ফাংশন এক্সপ্রেশনটির একটি বিবৃতি থাকে তবে আপনি নিম্নলিখিত বাক্য গঠনটি ব্যবহার করতে পারেন:

p => ({foo: "bar", attr2: "some value", "attr3": "syntax choices"})

তবে আপনি যদি একাধিক বিবৃতি পেতে চান তবে নীচের বাক্য গঠনটি ব্যবহার করতে পারেন:

p => {return {foo: "bar", attr2: "some value", "attr3": "syntax choices"}}

উপরের উদাহরণে, কোঁকড়া ধনুর্বন্ধনী প্রথম সেটটি একটি বহু-বিবৃতি কোড ব্লক খোলে, এবং কোঁকড়া ধনুর্বন্ধনী দ্বিতীয় সেট গতিশীল বস্তুর জন্য। অ্যারো ফাংশনের মাল্টি-স্টেটমেন্ট কোড ব্লকে, আপনাকে স্পষ্টভাবে রিটার্নের স্টেটমেন্ট ব্যবহার করতে হবে

আরও তথ্যের জন্য, পরীক্ষা করুন জন্য, জেএস অ্যারো ফাংশন এক্সপ্রেশনগুলির জন্য মজিলা ডক্স


-2

আপনি আরও কাস্টম সমাধানের জন্য এটি সর্বদা পরীক্ষা করে দেখতে পারেন:

x => ({}[x.name] = x);
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.