জাভাস্ক্রিপ্টে একটি অ্যারের শুরুতে আমি কীভাবে নতুন অ্যারে উপাদান যুক্ত করতে পারি?


1583

অ্যারের শুরুতে আমার উপাদানগুলি যুক্ত করতে বা সংশোধন করতে হবে।

উদাহরণস্বরূপ, যদি আমার অ্যারেটি নীচের মত দেখাচ্ছে:

[23, 45, 12, 67]

এবং আমার এজেএক্স কলটির প্রতিক্রিয়া হ'ল 34, আমি চাই যে আপডেট হওয়া অ্যারেটি নিম্নলিখিতগুলির মতো হয়:

[34, 23, 45, 12, 67]

বর্তমানে আমি এটি এটি করার পরিকল্পনা করছি:

var newArray = [];
newArray.push(response);

for (var i = 0; i < theArray.length; i++) {
    newArray.push(theArray[i]);
}

theArray = newArray;
delete newArray;

এটি করার আরও ভাল উপায় আছে কি? জাভাস্ক্রিপ্টের এমন কোনও বিল্ট-ইন কার্যকারিতা রয়েছে কি?

আমার পদ্ধতির জটিলতা O(n)এবং আরও ভাল বাস্তবায়ন দেখতে আকর্ষণীয় হবে।


9
এফওয়াইআই: যদি আপনাকে অ্যারের শুরুতে অবিচ্ছিন্নভাবে একটি উপাদান সন্নিবেশ করা প্রয়োজন , সমস্ত সময় pushকল করার reverseপরিবর্তে একটি কল অনুসরণ করার পরে বিবৃতিগুলি ব্যবহার করা দ্রুত হয় unshift
জেনি ও'রেলি

2
@ জেনিও'রিলি আপনার উত্তর হিসাবে এটি পোস্ট করা উচিত। আমার ব্যবহারের ক্ষেত্রে পুরোপুরি মিলছে। ধন্যবাদ
রব

2
পারফরম্যান্স টেস্ট: jsperf.com/adding-element-to-the-array-start তবে প্রতিটি ব্রাউজারের জন্য ফলাফল আলাদা।
আওয়ার্নিকোজ

উত্তর:


2810

ব্যবহার unshift। এটি এর মতো push, এটি শেষের পরিবর্তে অ্যারের শুরুতে উপাদান যুক্ত করে।

  • unshift/ push- একটি অ্যারের শুরু / শেষের দিকে একটি উপাদান যুক্ত করুন
  • shift/ pop - সরান এবং একটি অ্যারের প্রথম / শেষ উপাদানটি ফিরিয়ে দিন

একটি সহজ চিত্র ...

   unshift -> array <- push
   shift   <- array -> pop

এবং চার্ট:

          add  remove  start  end
   push    X                   X
    pop           X            X
unshift    X             X
  shift           X      X

পরীক্ষা করে দেখুন MDN এরে ডকুমেন্টেশন । কার্যত প্রতিটি ভাষায় যে অ্যারে থেকে উপাদানগুলিকে ধাক্কা / পপ করার ক্ষমতা রাখে সেগুলির উপাদানগুলি আনশিফ্ট / শিফট (কখনও কখনও বলা হয় push_front/ pop_front) করার ক্ষমতাও থাকতে পারে , আপনাকে এগুলি নিজেই প্রয়োগ করতে হবে না।


মন্তব্যে উল্লিখিত হিসাবে, আপনি যদি নিজের আসল অ্যারেটি পরিবর্তন করতে না চান তবে আপনি ব্যবহার করতে পারেন concat, যা দুই বা ততোধিক অ্যারে একসাথে একত্রিত করে। আপনি এটি ব্যবহার করে বিদ্যমান অ্যারের সামনের বা পিছনে একক উপাদানকে কার্যকরীভাবে ঠেলাতে পারেন; এটি করতে, আপনাকে নতুন উপাদানকে একটি একক উপাদান অ্যারেতে পরিণত করতে হবে:

const array = [ 3, 2, 1 ]

const newFirstElement = 4

const newArray = [newFirstElement].concat(array) // [ 4, 3, 2, 1 ]

concatআইটেম সংযোজন করতে পারেন। যুক্তি যে concatকোনও ধরণের হতে পারে; তারা স্পষ্টতই একটি একক উপাদান অ্যারে আবৃত হয়, যদি তারা ইতিমধ্যে অ্যারে না হয়:

const array = [ 3, 2, 1 ]

const newLastElement  = 0

// Both of these lines are equivalent:
const newArray1 = array.concat(newLastElement)   // [ 3, 2, 1, 0 ]
const newArray2 = array.concat([newLastElement]) // [ 3, 2, 1, 0 ]

51
concatএটি নতুন অ্যারে ফিরিয়ে দেওয়ার কারণে ব্যবহার করা পছন্দনীয়। শৃঙ্খলার জন্য খুব দরকারী। [thingToInsertToFront].concat(originalArray).reduce(fn).reverse().map(fn)ইত্যাদি ... আপনি যদি ব্যবহার করেন তবে আপনি unshiftএই চেইনটি করতে পারবেন না কারণ আপনার ফিরে আসা সমস্ত দৈর্ঘ্য।
StJohn3D

4
শিফট / আনশিফ্ট, পুশ / পপ, বিভাজন। এই জাতীয় পদ্ধতির জন্য খুব যৌক্তিক নাম।
লিনাক্সুনিল

1396

অ্যারে অপারেশন চিত্র

var a = [23, 45, 12, 67];
a.unshift(34);
console.log(a); // [34, 23, 45, 12, 67]


117
এনক্রিপ্ট করা ফাংশন নামগুলির কারণে ... প্রতিদিনের চারটি ব্যবহৃত ফাংশনগুলির জন্য লোকের জন্য ভিজ্যুয়াল গাইডলাইনটির প্রয়োজনীয়তা হ'ল কেন আনশিফ্টটিকে সন্নিবেশ বলা হয় না? শিফট সরানো উচিত। ইত্যাদি ...
পাসকাল

76
// আনশিফ্টকে সন্নিবেশ বলা হয় না কেন? // এটি সি প্রোগ্রামিং ভাষার সম্মেলন থেকে আসে যেখানে অ্যারের উপাদানগুলিকে স্ট্যাকের মতো আচরণ করা হত। ( সম্পূর্ণ ব্যাখ্যার জন্য perlmonks.org/?node_id=613129 দেখুন )
dreftymac

25
@ প্যাসাল নং, সন্নিবেশ করা এবং অপসারণ করা এর জন্য বিশেষত খারাপ নাম হবে; তারা রেণ্ডম এক্সেস পরোক্ষভাবে পরিবর্তে যোগ করার / অ্যারের সামনে থেকে সরানোর
meagar

25
আমি ভাবতাম যে আনশিফটটি প্রথম কীটি সরিয়ে ফেলতে হবে এবং
শিফ্টটি প্রথম কীটিতে

27
আমি ডিএনএ রেফারেন্সটি পছন্দ করি
হান্টার ওয়েবদেব

235

ES6 এর সাথে স্প্রেড অপারেটরটি ব্যবহার করুন ...:

ডেমো

var arr = [23, 45, 12, 67];
arr = [34, ...arr]; // RESULT : [34,23, 45, 12, 67]

console.log(arr)


19
খাঁটি ফাংশনগুলির জন্য দরকারী একটি নতুন
অ্যারেও তৈরি

এখানে কর্মক্ষমতা জড়িত কি? এটি আনশিফ্ট () ব্যবহার করার চেয়ে ধীর?
পিটার টি।

1
অবশ্যই এটি ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে ধীরে কমে যাবে। আপনি যদি একটি বড় অ্যারে নিয়ে কাজ করছেন বা পারফরম্যান্সটি আপনার প্রথম প্রয়োজন, দয়া করে concatপরিবর্তে এটি ব্যবহার করার জন্য বিবেচনা করুন।
আবদনূর টুমি

পারফরম্যান্স 2018 সালে গুরুত্বপূর্ণ নয়, ব্রাউজার এবং নোডে নতুন সংস্করণ একই পারফরম্যান্স পান
স্ট্যাকডেভ

75

এর মাধ্যমে আর একটি উপায় concat

var arr = [1, 2, 3, 4, 5, 6, 7];
console.log([0].concat(arr));

concatএবং এর মধ্যে পার্থক্য unshiftএটি concatএকটি নতুন অ্যারে প্রদান করে। তাদের মধ্যে পারফরম্যান্স এখানে পাওয়া যাবে

function fn_unshift() {
  arr.unshift(0);
  return arr;
}

function fn_concat_init() {
  return [0].concat(arr)
}

এখানে পরীক্ষার ফলাফল

এখানে চিত্র বর্ণনা লিখুন


আপনার উত্তরের পক্ষে রেফারেন্স যুক্ত করা ছাড়া উভয়ের পারফরম্যান্স তুলনা যুক্ত করা ভাল।
ইভান দে পাজ সেন্টেনটো

আমি সবেমাত্র পেয়েছি জেএসচার সাময়িকভাবে অনুপলব্ধ যখন আমরা ভি 2 প্রকাশের জন্য কাজ করছি। লিঙ্কটি পরে আবার চেষ্টা করুন। ফলাফলগুলিতে লিঙ্ক না দিয়ে যুক্ত করার আরও একটি ভাল কারণ।
টাইগার

jsPref ফলাফল: unshift: 25.510 ± 3.18% 99% ধীর concat: 2.436.894 ± 3,39% দ্রুততম
Illuminator

সর্বশেষতম সাফারিতে, fn_unshift () দ্রুত চলে।
Passatgt

সর্বশেষতম সাফারিতে (বনাম 10), fn_unshift () আবার ধীর।
আরএমসিচারি

45

দ্রুত চিট পত্র

শিফট / আনশিফ্ট এবং পুশ / পপ শব্দগুলি কিছুটা বিভ্রান্তিকর হতে পারে, কমপক্ষে এমন লোকদের কাছে যারা সি তে প্রোগ্রামিংয়ের সাথে পরিচিত নাও হতে পারে to

আপনি যদি লিঙ্গোর সাথে পরিচিত না হন তবে এখানে বিকল্প পদগুলির একটি দ্রুত অনুবাদ দেওয়া হয়েছে, যা মনে রাখা সহজ হতে পারে:

* array_unshift()  -  (aka Prepend ;; InsertBefore ;; InsertAtBegin )     
* array_shift()    -  (aka UnPrepend ;; RemoveBefore  ;; RemoveFromBegin )

* array_push()     -  (aka Append ;; InsertAfter   ;; InsertAtEnd )     
* array_pop()      -  (aka UnAppend ;; RemoveAfter   ;; RemoveFromEnd ) 

20

আপনার একটি অ্যারে আছে: var arr = [23, 45, 12, 67];

শুরুতে কোনও আইটেম যুক্ত করতে, আপনি ব্যবহার করতে চান splice:

var arr = [23, 45, 12, 67];
arr.splice(0, 0, 34)
console.log(arr);


arr.splice (0, arrleleth, 34);
লাইয়ার এলরম

1
@ লিয়ারএলরোম আপনার স্নিপেট কী করে?
জানুস ট্রয়লসন

@ পুশি এটির ব্রাউজার নির্দিষ্ট, ফায়ারফক্স 54-এ unshift50% দ্রুত (তবে বেশিরভাগই বেশি পঠনযোগ্য)
আইসিএল 7126

পুনঃটুইট ওয়ে ধীর।
অ্যান্ড্রু

17

মিউটেট ছাড়া

প্রকৃতপক্ষে, সমস্ত unshift/ pushএবং shift/ উত্স অ্যারেটি pop পরিবর্তন করুন।

unshift/ pushশুরু / শেষ থেকে অস্তিত্ব অ্যারের একটি আইটেম যোগ shift/ popএকটি অ্যারের শুরুতে / শেষ থেকে একটি আইটেম মুছে ফেলুন।

কোনও রূপান্তর ছাড়াই অ্যারেতে আইটেম যুক্ত করার কয়েকটি উপায় রয়েছে। কোডটি নীচে অ্যারের ব্যবহারের শেষে যুক্ত করতে ফলাফলটি একটি নতুন অ্যারে:

const originArray = ['one', 'two', 'three'];
const newItem = 4;

const newArray = originArray.concat(newItem); // ES5
const newArray2 = [...originArray, newItem]; // ES6+

কোডের নীচে মূল অ্যারের ব্যবহার শুরু করতে যুক্ত করতে:

const originArray = ['one', 'two', 'three'];
const newItem = 0;

const newArray = (originArray.slice().reverse().concat(newItem)).reverse(); // ES5
const newArray2 = [newItem, ...originArray]; // ES6+

উপরের উপায়ে, আপনি কোনও মিউটেশন ছাড়াই একটি অ্যারের শুরু / শেষে যুক্ত করবেন।


আমি এটিকে পরিবর্তন থেকে রোধ করার জন্য sliceশেষে একটি ফাংশন রেখেছি originArray
আহমদ খানি

1
অসাধারণ! (রেডাক্স) স্টেট ম্যানেজমেন্টের কথা আসলে ... এই উত্তরটি মূল্যবান!
পেড্রো ফেরেরিরা

1
এই সঠিক উপায়!
মিমি

10

ES6 ডেস্ট্রাকচারিং ব্যবহার করে: (আসল অ্যারে থেকে রূপান্তর এড়ানো)

const newArr = [item, ...oldArr]



8

যদি আপনাকে অ্যারের শুরুতে অবিচ্ছিন্নভাবে একটি উপাদান সন্নিবেশ করা প্রয়োজন , সমস্ত সময় pushকল করার reverseপরিবর্তে একটি কল অনুসরণ করার পরে বিবৃতিগুলি ব্যবহার করা তত দ্রুত unshift

বেঞ্চমার্ক পরীক্ষা: http://jsben.ch/kLIYf


1
দ্রষ্টব্য: প্রাথমিক অ্যারেটি খালি থাকতে হবে।
192kb

5

ব্যবহার করে spliceআমরা বেটিং এ অ্যারেতে একটি উপাদান sertোকান:

arrName.splice( 0, 0, 'newName1' );

এটি একটি সঠিক উত্তর। আপনাকে ধন্যবাদ শ্রীকৃষ্ণ
খান ট্রান
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.