كيف يمكنني تحويل كائن "وسائط" إلى مصفوفة في JavaScript؟




arrays sorting (14)

ES6 باستخدام معايير الراحة

إذا كنت قادرًا على استخدام ES6 ، فيمكنك استخدام:

معايير الراحة

function sortArgs(...args) {
  return args.sort(function (a, b) { return a - b; });
}

document.body.innerHTML = sortArgs(12, 4, 6, 8).toString();

كما يمكنك أن تقرأ في الرابط

يسمح لنا بناء جملة المعلمة المتبقية بتمثيل عدد غير محدد من الوسيطات كصفيف.

إذا كنت تشعر بالفضول حول ... بناء الجملة ، يطلق عليه Spread Operator ويمكنك قراءة المزيد here .

ES6 باستخدام array.from ()

باستخدام array.from :

function sortArgs() {
  return Array.from(arguments).sort(function (a, b) { return a - b; });
}

document.body.innerHTML = sortArgs(12, 4, 6, 8).toString();

Array.from ببساطة تحويل Array-like أو Iterable الكائنات إلى حالات Array.

ES5

يمكنك فقط استخدام وظيفة slice Array في كائن وسيطات ، وسوف تقوم بتحويلها إلى صفيف JavaScript قياسي. سيكون عليك فقط الرجوع إليه يدويًا من خلال النموذج الأولي للنموذج:

function sortArgs() {
    var args = Array.prototype.slice.call(arguments);
    return args.sort();
}

لماذا هذا العمل؟ حسنًا ، إليك مقتطف من وثائق ECMAScript 5 نفسها :

ملاحظة : وظيفة slice عامة عمدا؛ لا يتطلب أن تكون هذه القيمة الخاصة به كائن صفيف. لذلك يمكن نقلها إلى أنواع أخرى من الكائنات لاستخدامها كطريقة. ما إذا كان يمكن تطبيق وظيفة slice بنجاح على كائن مضيف أم لا ، فهذا يعتمد على التطبيق.

لذلك ، تعمل slice على أي شيء له خاصية length ، أي arguments ملائم.

إذا كان Array.prototype.slice كثيرًا من الفم ، يمكنك اختصاره قليلاً باستخدام القيم الحرفية للمجموعة:

var args = [].slice.call(arguments);

ومع ذلك ، فإنني أميل إلى الشعور بأن النسخة السابقة أكثر وضوحًا ، لذلك أفضلها بدلاً من ذلك. إساءة استخدام مجموعة مصفوفة الحرفيه يشعر بالغباء ويبدو غريب.

إن كائن arguments في جافا سكريبت هو ثؤلول فردي ، فهو يتصرف تمامًا مثل مصفوفة في معظم الحالات ، ولكنه ليس في الحقيقة كائن مصفوفة. نظرًا لأنه فعلًا شيء آخر تمامًا ، فإنه لا يحتوي على الوظائف المفيدة من Array.prototype مثل forEach sort filter map .

من السهل جدًا إنشاء صفيف جديد من كائن معارض بحلقة بسيطة. على سبيل المثال ، تقوم هذه الوظيفة بفرز الوسائط الخاصة بها:

function sortArgs() {
    var args = [];
    for (var i = 0; i < arguments.length; i++)
        args[i] = arguments[i];
    return args.sort();
}

ومع ذلك ، هذا هو شيء مثير للشفقة لا بد من القيام به ببساطة للحصول على وظائف صفيف جافا سكريبت مفيدة للغاية. هل هناك طريقة مدمجة للقيام بذلك باستخدام المكتبة القياسية؟


Benshmarck 3 الطرق:

function test()
{
  console.log(arguments.length + ' Argument(s)');

  var i = 0;
  var loop = 1000000;
  var t = Date.now();
  while(i < loop)
  {
      Array.prototype.slice.call(arguments, 0); 
      i++;
  }
  console.log(Date.now() - t);


  i = 0,
  t = Date.now();
  while(i < loop)
  {
      Array.apply(null, arguments);
      i++;
  }
  console.log(Date.now() - t);

  i = 0,
  t = Date.now();
  while(i < loop)
  {
      arguments.length == 1 ? [arguments[0]] : Array.apply(null, arguments);
      i++;
  }
  console.log(Date.now() - t);
}

test();
test(42);
test(42, 44);
test(42, 44, 88, 64, 10, 64, 700, 15615156, 4654, 9);
test(42, 'truc', 44, '47', 454, 88, 64, '@ehuehe', 10, 64, 700, 15615156, 4654, 9,97,4,94,56,8,456,156,1,456,867,5,152489,74,5,48479,89,897,894,894,8989,489,489,4,489,488989,498498);

نتيجة؟

0 Argument(s)
256
329
332
1 Argument(s)
307
418
4
2 Argument(s)
375
364
367
10 Argument(s)
962
601
604
40 Argument(s)
3095
1264
1260

استمتع !


أوصي باستخدام here 6 ECMAScript ، والتي سوف ربط المعلمات زائدة إلى صفيف. مع هذا الحل لا تحتاج إلى لمس كائن arguments وسيتم تبسيط التعليمات البرمجية الخاصة بك. الجانب السلبي لهذا الحل هو أنه لا يعمل عبر معظم المتصفحات ، لذلك بدلا من ذلك سيكون عليك استخدام مترجم JS مثل Babel. تحت غطاء محرك السيارة بابل يحول arguments إلى صفيف مع حلقة.

function sortArgs(...args) {
  return args.sort();
}

إذا لم تستطع استخدام ECMAScript 6 ، أوصيك بالنظر إلى بعض الإجابات الأخرى مثلJonathan Fingland

function sortArgs() {
    var args = Array.prototype.slice.call(arguments);
    return args.sort();
}

إجابة أخرى.

استخدام نوبات السحر الاسود:

function sortArguments() {
  arguments.__proto__ = Array.prototype;
  return arguments.slice().sort();
}

فايرفوكس و Chrome و Node.js و IE11 على ما يرام.


استخدم array.from ، الذي يأخذ كائن شبيه بالمصفوفة (مثل arguments ) كوسيطة ويقوم بتحويلها إلى مصفوفة:

(function() {
  console.log(Array.from(arguments));
}(1, 2, 3));

لاحظ أنه لا يعمل في بعض المتصفحات القديمة مثل IE 11 ، لذلك إذا كنت تريد دعم هذه المتصفحات ، يجب عليك استخدام Babel .


استعمال:

function sortArguments() {
  return arguments.length === 1 ? [arguments[0]] :
                 Array.apply(null, arguments).sort();
}

Array(arg1, arg2, ...) تُرجع [arg1, arg2, ...]

Array(str1) ترجع [str1]

إرجاع Array(num1) صفيف يحتوي على عناصر num1

يجب عليك التحقق من عدد من الحجج!

إصدار Array.slice (أبطأ):

function sortArguments() {
  return Array.prototype.slice.call(arguments).sort();
}

إصدار Array.push (أبطأ ، أسرع من الشريحة):

function sortArguments() {
  var args = [];
  Array.prototype.push.apply(args, arguments);
  return args.sort();
}

نقل الإصدار (أبطأ ، ولكن الحجم الصغير أسرع):

function sortArguments() {
  var args = [];
  for (var i = 0; i < arguments.length; ++i)
    args[i] = arguments[i];
  return args.sort();
}

إصدار Array.concat (الأبطأ):

function sortArguments() {
  return Array.prototype.concat.apply([], arguments).sort();
}

على الرغم من أن المعلمات تعمل بشكل جيد ، إذا كنت ترغب في الاستمرار في استخدام arguments لسبب ما ، والنظر في

function sortArgs() {
  return [...arguments].sort()
}

يمكن اعتبار [...arguments] نوعا من البديل ل Array.from(arguments) ، والتي تعمل أيضا بشكل جيد.

بديل ES7 هو فهم مجموعة:

[for (i of arguments) i].sort()

قد يكون هذا أسهل إذا كنت تريد معالجة أو تصفية الوسيطات قبل الفرز:

[for (i of arguments) if (i % 2) Math.log(i)].sort()

في ECMAScript 6 ليس هناك حاجة لاستخدام الاختراقات القبيحة مثل Array.prototype.slice() . يمكنك بدلاً من ذلك استخدام here .

(function() {
  console.log([...arguments]);
}(1, 2, 3))

قد تبدو غريبة ، لكنها بسيطة إلى حد ما. انها مجرد استخراج عناصر " arguments " ووضعها مرة أخرى إلى مجموعة. إذا كنت لا تزال لا تفهم ، فاطلع على هذه الأمثلة:

console.log([1, ...[2, 3], 4]);
console.log([...[1, 2, 3]]);
console.log([...[...[...[1]]]]);

لاحظ أنه لا يعمل في بعض المتصفحات القديمة مثل IE 11 ، لذلك إذا كنت تريد دعم هذه المتصفحات ، يجب عليك استخدام Babel .


من المفيد أيضًا الرجوع إلى صفحة wiki library الخاصة بمكتبة Bluebird التي تُظهر كيفية إدارة كائن arguments إلى مصفوفة بطريقة تجعل الوظيفة قابلة للتحسين تحت محرك جافا سكريبت V8 :

function doesntLeakArguments() {
    var args = new Array(arguments.length);
    for(var i = 0; i < args.length; ++i) {
        args[i] = arguments[i];
    }
    return args;
}

يتم استخدام هذه الطريقة لصالح var args = [].slice.call(arguments); . يوضح المؤلف أيضًا كيف يمكن لخطوة بناء أن تساعد في تقليل الإسهاب.


هذا سؤال قديم جدًا ، لكنني أعتقد أن لدي حلًا أسهل قليلاً من الحلول السابقة ولا يعتمد على المكتبات الخارجية:

function sortArguments() {
  return Array.apply(null, arguments).sort();
}

هنا هو معيار من عدة طرق تحويل الحجج إلى مجموعة.

بالنسبة لي ، أفضل حل لكمية صغيرة من الحجج هو:

function sortArgs (){
  var q = [];
  for (var k = 0, l = arguments.length; k < l; k++){
    q[k] = arguments[k];
  }
  return q.sort();
}

للحالات الأخرى:

function sortArgs (){ return Array.apply(null, arguments).sort(); }

function sortArgs(...args) {
  return args.sort(function (a, b) { return a - b; });
}

document.body.innerHTML = sortArgs(1, 2, 3, 4).toString();


function sortArg(){
var args = Array.from(arguments); return args.sort();
}

 function sortArg(){
    var args = Array.from(arguments); 
    return args.sort();
    }
 
 console.log(sortArg('a', 'b', 1, 2, '34', 88, 20, '19', 39, 'd', 'z', 'ak', 'bu', 90));


function sortArgs(){ return [].slice.call(arguments).sort() }

// Returns the arguments object itself
function sortArgs(){ return [].sort.call(arguments) }

يتم إجراء بعض أساليب الصفيف بشكل غير مقصود حتى لا يتطلب أن يكون الكائن الهدف صفيفًا فعليًا. أنها تتطلب فقط الهدف أن يكون لها خاصية مسمى الطول والمؤشرات (التي يجب أن تكون الأعداد الصحيحة صفر أو أكبر).

[].sort.call({0:1, 1:0, length:2}) // => ({0:0, 1:1, length:2})




variadic-functions