تحويل النص إلى رقم في TypeScript (والرقم إلى نص)

لتحويل نص إلى رقم في TypeScript، استدعِ Number(text). نوع الناتج number، وقيمته NaN عندما لا يكون النص رقمًا صحيحًا. وللنص الذي يحتوي على أحرف لاحقة، مثل "42px"، استخدم parseInt(text, 10) أو parseFloat(text).

const input: string = "42";

const a = Number(input);       // 42
const b = parseInt(input, 10); // 42 (whole numbers)
const c = parseFloat("3.75");  // 3.75
const d = +input;              // 42 (unary plus, same as Number)

console.log(a + 1, b + 1, c + 1, d + 1); // 43 43 4.75 43

// And back: number to string
const text: string = String(a);
console.log(text, text.length); // 42 2

طرق التحويل الأربع كلها تعيد النوع number. لا تعرف TypeScript إن كان النص صحيحًا؛ والنص غير الصحيح يعطي number أيضًا، قيمته NaN.

لماذا يجب أن تحوّل

حقول النماذج ومعاملات URL ومتغيرات البيئة ومحتويات الملفات تصل كنصوص. ولن تسمح لك TypeScript باستخدام أحدها حيث يُتوقع رقم:

// This does not compile: a string is not a number.
const quantity: string = "3";
const total: number = quantity * 10;
console.log(total);

index.ts(3,23): error TS2362: The left-hand side of an arithmetic operation must be of type 'any', 'number', 'bigint' or an enum type.

العمليات الحسابية - و* و/ على نص خطأ. أما + فمسموح لكنه يدمج النصوص، فيكون "3" + 10 هو النص "310"، ولهذا يجب أن يأتي التحويل أولًا: Number(quantity) * 10.

ولا يفيد تأكيد النوع أيضًا. يُرفض quantity as number (TS2352)، وفرضه عبر as unknown as number لا يفعل سوى إسكات المترجم: تبقى القيمة نصًا وقت التشغيل.

Number مقابل parseInt مقابل parseFloat مقابل + الأحادي

تتفق الدوال الأربع على المدخلات النظيفة وتختلف في كل ما عداها. هذا الجدول هو الناتج الفعلي لكل منها على Node:

القواعد وراء الجدول:

• Number و+ الأحادي متطابقان. يحوّلان النص كله بعد حذف المسافات من الطرفين، ويفهمان 1e3 والنظام الست عشري 0x، ويعيدان NaN إذا تبقى أي شيء. النص الفارغ أو المكون من مسافات فقط يصبح 0.
• يقرأ parseInt وparseFloat من البداية ويتوقفان عند أول حرف لا يستطيعان استخدامه، لذلك يعطي "42px" و"1,000" أرقامًا جزئية. والنص الفارغ يعطي NaN.
• يحذف parseInt الجزء الكسري ولا يفهم الأسس: "1e3" يتوقف عند e.
• فواصل الأرقام (12_000) صحيحة في الكود المصدري، لا في النصوص.

Number هو الخيار الأكثر صرامة للتحقق من المدخلات. ويناسب parseInt وparseFloat النصوص التي تحمل فعلًا وحدة أو لاحقة، مثل أحجام CSS.

معالجة المدخلات غير الصحيحة: NaN

نوع NaN هو number، لذلك لا يحذرك المترجم منه أبدًا. تحقق من الناتج بنفسك باستخدام Number.isNaN أو Number.isFinite:

function toNumber(text: string): number | undefined {
    if (text.trim() === "") return undefined; // Number("") would be 0
    const n = Number(text);
    return Number.isFinite(n) ? n : undefined;
}

for (const s of ["12.5", "", "abc", "7 ", "Infinity"]) {
    console.log(JSON.stringify(s), toNumber(s));
}

const age = toNumber("30");
if (age !== undefined) {
    console.log(age + 1); // age is number here
}

إعادة number | undefined تجعل الفشل جزءًا من النوع، فيجب على كل مستدعٍ معالجته قبل إجراء العمليات الحسابية. ويرفض Number.isFinite أيضًا Infinity، التي يعيدها Number("Infinity") دون تردد.

تجنب isNaN(x) العامة: إنها تحوّل وسيطها أولًا، لذلك isNaN("abc") يساوي true في JavaScript. تعريفها في TypeScript لا يقبل إلا number، فتمرير نص هو الخطأ TS2345، وهذه إشارة إلى استخدام Number.isNaN على قيمة محوّلة مسبقًا.

تحويل النص إلى عدد صحيح

مرّر دائمًا الوسيط الثاني لـ parseInt، وهو الأساس: 10 للنص العشري. إنه اختياري، لكنه يوثّق النية ويهم مع الأسس الأخرى. وللحصول على عدد صحيح من نص عشري، حوّل ثم قرّب صراحة.

console.log(parseInt("0042", 10)); // 42
console.log(parseInt("ff", 16));   // 255
console.log(parseInt("1010", 2));  // 10

const price = Number("19.99");
console.log(Math.trunc(price), Math.round(price), Math.floor(price)); // 19 20 19

console.log(Number.isInteger(Number("7")));   // true
console.log(Number.isInteger(Number("7.5"))); // false

console.log(BigInt("9007199254740993")); // 9007199254740993n

يتوقع parseInt نصًا: parseInt(12.7) خطأ ترجمة (TS2345)، وهذا مفيد، لأن parseInt في JavaScript يحوّل الرقم إلى نص أولًا ويعطي نتائج خاطئة لقيم مثل 0.0000005 (يعيد 5). استخدم Math.trunc مع الأرقام. وللأعداد الصحيحة التي تتجاوز Number.MAX_SAFE_INTEGER، يحلل BigInt(text) القيمة الكاملة (ويرمي SyntaxError مع النص غير الصحيح بدل إعادة NaN).

تحويل الرقم إلى نص

كل من String(n) وn.toString() و`${n}` يحوّل الرقم إلى أقصر صيغة نصية له. وتعطي دوال التنسيق تحكمًا أكبر:

const n = 1234.5678;

console.log(String(n));            // 1234.5678
console.log(n.toString());         // 1234.5678
console.log(`${n}`);               // 1234.5678
console.log(n.toFixed(2));         // 1234.57
console.log(n.toPrecision(3));     // 1.23e+3
console.log(n.toLocaleString("en-US")); // 1,234.568
console.log((255).toString(16));   // ff
console.log((5).toString().padStart(3, "0")); // 005

const label: string = n.toFixed(1); // every method here returns string
console.log(label);                 // 1234.6

يقرّب toFixed القيمة الثنائية لا العدد العشري الذي كتبته، لذلك (1.005).toFixed(2) يساوي "1.00": تُخزَّن 1.005 كقيمة أقل بقليل من 1.005. وللمبالغ المالية، احتفظ بالمبالغ كسنتات صحيحة أو نسّقها بـ Intl.NumberFormat.

يعمل String(n) أيضًا مع null وundefined (فيعطي "null" و"undefined")، بينما يكون n.toString() خطأ ترجمة تحت strict، لأن القيمة قد تكون غائبة.

مرجع سريع