چگونه یک عنصر آرایه را با تایپاسکریپت پیدا کنم؟ (یک روش مدرن و آسانتر)


آیا راه مرسومی برای پیدا کردن یک مورد در آرایه با تایپاسکریپت وجود دارد؟

ES6+ این روش ساده/تمیز را امکانپذیر میکند

[{"id":1}, {"id":-2}, {"id":3}].find(myObj => myObj.id < 0)  // returns {"id":-2}

تایپاسکریپت بسیاری از ویژگیهای ES6+ را پیادهسازی میکند و همچنان به این کار ادامه میدهد. به نظر میرسد که احتمالاً حداقل همان راهحل خوبی را دارد، بنابراین:

چگونه میتوان یک آیتم را در یک آرایه با استفاده از TypeScript پیدا کرد، با در نظر گرفتن سهولت استفاده، بهترین شیوههای مدرن و سادگی و زیبایی؟
(بازگو کردن سوال کمی متفاوت برای یافتن بهترین روشها)

یادداشتها

  • "مورد" میتواند یک شیء جاوااسکریپت باشد، یا تقریباً هر چیز دیگری. مثالی که در بالا آمده است مربوط به یافتن اشیاء ساده و بومی JS است، اما سناریوهای زیادی وجود دارد.

  • «کاننیکال» فقط یک روش رسمی و شیک در علوم کامپیوتر (و سایر زمینهها) برای گفتن «قاعده یا فرمول استاندارد پذیرفتهشده» است (به یاد داشته باشید که همه اینجا در مقطعی این را نمیدانستند)

  • این مربوط به ویژگیهای جدید نیست. هر نسخهای از JS میتواند این کار را انجام دهد. با این حال، روش انجام آن هر چه به گذشته برگردید، کمتر جذاب میشود.

  • نقشه راه TypeScript برای مرجع.

پاسخ شماره ۱

بخش اول - پلیفیل

برای مرورگرهایی که آن را پیادهسازی نکردهاند، یک پلیفیل برای array.find. با تشکر از MDN.

if (!Array.prototype.find) {
  Array.prototype.find = function(predicate) {
    if (this == null) {
      throw new TypeError('Array.prototype.find called on null or undefined');
    }
    if (typeof predicate !== 'function') {
      throw new TypeError('predicate must be a function');
    }
    var list = Object(this);
    var length = list.length >>> 0;
    var thisArg = arguments[1];
    var value;

    for (var i = 0; i < length; i++) {
      value = list[i];
      if (predicate.call(thisArg, value, i, list)) {
        return value;
      }
    }
    return undefined;
  };
}

بخش دوم - رابط کاربری

شما نیاز دارید رابط باز Array را گسترش دهید تا متد find را شامل شود.

interface Array<T> {
    find(predicate: (search: T) => boolean) : T;
}

وقتی این در تایپاسکریپت برسد، از کامپایلر یک هشدار دریافت خواهید کرد که شما را به حذف این مورد یادآوری میکند.

بخش سوم - از آن استفاده کنید

متغیر x نوع مورد انتظار را خواهد داشت... { id: number }

var x = [{ "id": 1 }, { "id": -2 }, { "id": 3 }].find(myObj => myObj.id < 0);

پاسخ شماره ۲

برای برخی پروژهها راحتتر است که هدف خود را در فایل tsconfig.json به es6 تنظیم کنید.

{
  "compilerOptions": {
    "target": "es6",
    ...

پاسخ شماره ۳

بازی با tsconfig.json شما همچنین میتوانید به این صورت هدفگیری es5 را انجام دهید:

{
    "compilerOptions": {
        "experimentalDecorators": true,
        "module": "commonjs", 
        "target": "es5"
    }
    ...