يتم تحويل الشكل إلى صفيف حقيقي
دعنا نتحدث عن سيناريو الاستخدام أولاً. في JS ، نحتاج إلى تشغيل DOM بشكل متكرر ، مثل الحصول على علامات الإدخال لجميع الصفحات ، وإيجاد عنصر من زر النوع ، ثم تسجيل حدث نقرة لهذا الزر. قد نفعل هذا ؛
var inpectObjs = document.getElementsByTagName ('input') ؛ for (var i = 0 ؛ i <inpectObjs.length ؛ i ++) {if (inpectObjs [i] .type === 'button') {inpectobjs [i] .onclick = function () {return ؛}}}}}}}}}}}}}}}}بالتأكيد لا توجد مشكلة في الكتابة بهذه الطريقة ، لكننا نعلم أن العديد من طرق تشغيل المصفوفات أفضل بكثير من الحلقات ، مثل طريقة foreach من ES5 مفيدة للغاية ؛ ولكن هل يمكن استخدامه مباشرة؟ لا يمكن! نظرًا لأن مجموعة كائن DOM ليست نوعًا صفيفًا حقيقيًا ، فسيؤدي ذلك إلى خطأ إذا كنت تستخدمه مباشرة ؛
var inpectObjs = document.getElementSbyTagName ('input') ؛ inputObjs.foreach () ؛ //inputobjs.foreach ليست وظيفةعلى الرغم من هذا ، لا يزال بإمكاننا استخدامه. لا يمكننا استخدامه بشكل مباشر أو غير مباشر. فقط استخدم وظيفة انتحال شخصية كائن JS القوية ؛
var inpectObjs = document.getElementSbyTagName ('input') ؛ console.info (inputObjs) ؛ // [] الطول: 0__proto__: htmlcollectionConsole.info ([] // [] الطول: 0__proto__: صفيف [0]وبهذه الطريقة ، بعد تحويلها إلى صفيف حقيقي ، يمكنك استدعاء طريقة الصفيف حسب الرغبة ؛ هذه الطريقة ممكنة بالتأكيد ، لكن ليس من السهل فهمها و "Twirl". يوفر لنا ES6 طريقة أبسط وأكثر مباشرة ، وهو أمر بسيط للغاية للاستخدام:
var inpectObjs = document.getElementSbyTagName ('input') ؛ console.info (inputObjs) ؛ ] // [] الطول: 0__proto__: صفيف [0]والنتيجة هي نفسها ، لكنها أكثر مناسبة بشكل دلالي وأسهل في الفهم. أليس من السهل استخدامه؟ بالطبع هذه ليست كافية. لا يمكن فقط تحويل أي نوع من بيانات صفيف الفئة إلى صفيف باستخدام هذه الطريقة ، ولكن تأثيرات الأنواع المختلفة مختلفة. الاختبار كما يلي:
دع str = 'Google' ؛ console.log (array.from (str)) ؛ // ["G" ، "O" ، "O" ، "O" ، "G" ، "L" ، "E"] Let num = 234 ؛ console.log (Array.from (num)) ؛ // [] دع bol = false ؛ console.log (array.from (bol)) ؛ دع obj = {foo: 'foo' ، bar: 'bar'} ؛ console.log (array.from (obj)) ؛ // [] دع superobj = {0: 'foo' ، 1: 'bar' ، length: 2} ؛ console.log (array.from (superobj)) ؛ // ["Foo" ، "Bar"]فيما يلي نتائج استدعاء هذه الطريقة من خلال أنواع البيانات المختلفة. تجدر الإشارة إلى أنه يمكن تحويل الأوتار وبعض الكائنات الخاصة إلى صفائف ذات محتوى. تشير الكائنات الخاصة إلى الكائنات التي يتم ترتيب محتواها وفقًا لأزواج القيمة الرئيسية الرقمية ولها سمات طول. يمكن استخدام هذا النوع من الكائن للحلقات ، ويمكن أيضًا استخدام السلاسل للحلقات للحصول على كل حرف ، بحيث تتلخص في جملة واحدة. استخدام الطريقة من يمكن استخدام حلقة لإخراج محتوى الإخراج ليس صفيفًا فارغًا ؛ أود هنا أن أذكرك بأن الأصدقاء الذين استخدموا jQuery يمكنهم الانتباه إلى الهيكل الذي يتم إرجاع كائن jQuery عند استخدام المحدد لتحديد العناصر؟ في الواقع ، هذا هو الهيكل الأخير في مثالنا. للحصول على التفاصيل ، يرجى الرجوع إلى مقالات سلسلة تحليل رمز المصدر jQuery الخاص بي.
من قيم تحويل المصفوفات
هناك طريقتان لإنشاء صفيف ، أحدهما مُنشئ:
دع arr = صفيف (1،2،3) ؛
آخر هو الخلق الحرفي الأكثر استخدامًا:
دع arr = [1،2،3] ؛
الأسلوب array.of هي في الواقع ملحق للطريقة الأولى ، والاستخدام كما يلي:
console.log (Array.of (1،2،3)) ؛ // [1،2،3]
يبدو أن له نفس تأثير طريقة البناء ، فلماذا لا تزال هذه الطريقة ضرورية؟ انظر إلى الأمثلة التالية لفهم:
console.log (Array ()) ؛ // BudaperConsole.log(array(1) ؛ // budapundefined/201console.log(ray(1،2)) ؛ // [1،2]
في هذا المثال ، يختلف عدد المعلمات في معانيها. عندما يكون هناك معلمة واحدة فقط ، تمثل المعلمة العنصر الذي يمثله الطول. إذا كان أكبر من معلمة واحدة ، فسوف يسبب الارتباك. ومع ذلك ، ليس لديك هذه المشكلة مع الأسلوب.
console.log (array.of ()) ؛ // BudaperConsole.log(array.of(1) ؛ // Budap1/10console.log(array.of(1،2)) ؛ // [1،2]
appwithin array استبدال نسخة البيانات الداخلية
تتمثل الوظيفة الرئيسية لطريقة Copywithin في استبدال القيم الداخلية للمصفوفة. تقبل هذه الطريقة ثلاث معلمات ، تشير إلى موضع نسخة البدء ، وموضع النسخ النهائي وموضع الإدراج. المثال على النحو التالي:
[1 ، 2 ، 3 ، 4 ، 5] .copywithin (0 ، 3) // [4 ، 5 ، 3 ، 4 ، 5] // copy bit 3 to bit 0 [1 ، 2 ، 3 ، 4 ، 5]. 5] .copywithin (0 ، -2 ، -1) // [4 ، 2 ، 3 ، 4 ، 5] // copy bit 3 to bit 0 [] 2 ، 3 ، 4 ، 5]) ؛ i32a.copywithin (0 ، 2) ؛ // int32array [3 ، 4 ، 5 ، 4 ، 5] // للمنصات بدون طريقة copwithin من typedarray // طريقة الكتابة التالية مطلوبة []. 2 ، 3 ، 4 ، 5]
ما ورد أعلاه هو طريقة تمديد الصفيف في ES6 المقدمة لك من قبل المحرر. آمل أن يكون ذلك مفيدًا لك. إذا كان لديك أي أسئلة ، فيرجى ترك رسالة لي وسوف يرد المحرر إليك في الوقت المناسب. شكرا جزيلا لدعمكم لموقع wulin.com!