سیر تا پیاز Data Types ها در جاوا اسکریپت

هر برنامه و اپلیکیشنی با داده های زیادی در ارتباط هست و هر داده هم یکسری ابزار مختص به خود را داره و طی چهارچوب و مکانیزم مخصوص به خود کار میکنه. در این مطلب قراره نگاهی جامع به هر 8 نوع داده اصلی در جاواسکریپت داشته باشیم و هر آنچه که نیازه تا درباره data types ها در جاوااسکریپت بدانید را برایتان شرح دهیم.

ما هر نوعی از داده را میتونیم در یک متغیر ذخیره کنیم و حتی یک متغیر میتونه در یک لحظه حاوی یک number باشه و بعد هم string ذخیره کنه:

// بدون ارور
let message = "hello";
message = 123456;

و زبان های برنامه نویسی مثل جاوااسکریپت که به ما اجازه میدن تا مقدار یک متغیر را بطور کل تغییر بدیم را اصطلاحا dynamically typed مینامیم و این یعنی data type ها در این زبان وجود دارن اما متغیرها در جاوااسکریپت محدود به آنها نیستند.

Primitive data types

Number

اعداد هرجایی که حرف از محسابات باشه وجود دارند و ما در برنامه نویسی اعداد را به 2 گروه اعداد اعشاری و اعداد صحیح دسته بندی میکنیم.

عدد صحیح به اعداد کامل مثبت یا منفیه بدون اعشار گفته میشه، مثل: 0, 1, 10, -50, 100, -25

اعداد اعشاری هم به اعدادی مثل : 0.1, 3.878, -4589.4 گفته میشه

عملیات های مختلفی مثل جمع + , تفریق - , ضرب * , تقسیم / و ... را در برنامه خود روی اعداد انجام بدیم.

همچنین در کنار اعداد صحیح و اعشاری، یکسری مقادیر ویژه عددی Infinity, -Infinity و NaN هم داریم که متعلق به همین Data Type Number هست.

• Infinity بیانگر نامحدود ریاضیات هست. این یک مقدار ویژه هست که از تمامی اعداد بزرگتر هست و با تقسیم یک عدد بر صفر یا اشاره مستقیم بهش میتونیم اونرو ببینیم:
  

  console.log( 1 / 0 ); // خروجی : Infinity​
  console.log( Infinity ); // خروجی : Infinity​
  

• NaN به یک ارور محاسباتی اشاره میکنه و زمانی اتفاق میوفته که خطایی در محاسبه ما وجود داره، مثل زمانیکه در یک محسابه ضرب یکی از مقادیر استفاده شده در ضرب undefined و یا string باشه:
  

  console.log( "hello world" / 10 ); // خروجی : NaN
  console.log( undefined * 10 ); // خروجی : NaN​

  بخاطر داشته باشید که در هر محسابه ایی اگر تنها یک NaN وجود داشته باشه نتیجه کل اون محاسبه برابر با NaN خواهد بود ( البته به غیر از NaN ** 0 که یک یک مورد استثنا هست و نتیجه اون برابر با 1 خواهد بود )

  alert( NaN + 1 ); // NaN
  alert( 3 * NaN ); // NaN
  alert( "not a number" / 2 - 1 ); // NaN

BigInt

number در جاوااسکریپت نمیتونه بطور امن اعداد بزرگتر از (253-1) که برابر هست با 9007199254740991  را در بر بگیره و در محاسبات خارج از این رنج عدد با خطای دقت مواجه خواهیم شد و دلیلش هم این هست که تمامی این اعداد نمیتونن بطور ثابت در حافظه 64 بیتی قرار بگیرن. در نتیجه ما با یک مقدار تقریبی مواجه خواهیم شد.

به عنوان مثال، هردو مقدار زیر باوجود اینکه فقط یک و دو عدد بالاتر از محدوده امن هستند باهمدیگه برابر اند:

console.log(9007199254740991 + 1); // 9007199254740992
console.log(9007199254740991 + 2); // 9007199254740992

بنابر این تمام اعداد فرد بزرگتر از (253-1) به هیچ وجه در در تایپ number نمی گنجند.

در بیشتر محاسبات همین رنج امن (253-1) برای ما کفایت میکنه، ولی گاهی اوقات هم پیش میاد که محاسبات ما سنگین تر میشن و از این محدوده فراتر میرن و برای حل این مشکل BigInt به جاوااسکریپت اضافه شد.

یک مقدار BigInt را میشه به شکل های زیر ایجاد کرد:

// vojood 'n' dar enteha eshare be BigInt dare
const bigint = 1234567890123456789012345678901234567890n;

const sameBigint = BigInt("1234567890123456789012345678901234567890");

const bigintFromNumber = BigInt(10); // same as 10n

به این نکته دقت داشته باشید که در محاسبات باید تمامی مقادیر ما BigInt باشن و به عنوان مثال نمیتونیم یک تایپ Number را با یک تایپ BigInt جمع کنیم:

console.log(1n + 2); // Error: Cannot mix BigInt and other types

برای اینکار باید تایپ تمام مقادیر را به یک تایپ واحد تبدیل کنیم:

let bigint = 1n;
let number = 2;

// number به bigint
alert(bigint + BigInt(number)); // 3

// bigint به number
alert(Number(bigint) + number); // 3

توصیه میشه در تبدیل تایپ اعداد، درصورتی که یکی از تایپ ها BigInt هست ما بقیه تایپ هارا هم به همان BigInt تبدیل کنید چراکه درصورت تبدیل یک BigInt به Number و فراتر رفتن آن مقدار از محدوده امن (253-1) باعث خطای دقت در محاسبه میشه.

String

هر مقداری که در داخل quotes  ( " " یا ' ' یا ` ` ) محصور شده باشد را string میدانیم.

در جاوااسکریپت 3 نوع quotes داریم:

1. double quotes مثل " Hello world " .
2. single quotes مثل ' Hello world ' .
3. backticks مثل ` Hello world `

double quotes و single quotes یا به ترتیب " " و ' ' شکلی ساده از string هارا میسازن و عملا فرقی باهم ندارند. اما backticks یا همان ` ` به ما اجازه میدن تا در دل یک string کد جاوااسکریپتی بنویسیم و بطور مثال از مقدار یک متغیر در دل string استفاده کنیم.

let name = "John";

console.log( `Hello, ${name}!` ); // خروجی: Hello, John!

console.log( `the result is ${1 + 2}` ); // خروجی: the result is 3

هر عبارتی که در داخل { }$ قرار بگیره محاسبه و تبدیل به بخشی از آن string خواهد شد و ما میتونیم هرچیزی مثل یک متغیر یا یک محاسبه ریاضی و کد جاوااسکریپتی را داخل این عبارت قرار بدیم تا خروجی آن تبدیل به بخشی از آن string بشه.

Boolean

boolean فقط شامل دو مقدار true و false میباشد و از نام این 2 مقدار هم میشه فهمید که به یک بله یا خیر و یا یک درست یا نادرست اشاره میکنند و ما میتونیم در برسی های شرطی خودمون از اونها استفاده کنیم.

let isChecked = true; // این متغیر یجورایی چک شدن را تایید میکنه
let isDone = false; // این متغیر هم انجام شدن یک کاری را رد میکنه

همچنین مقادیر boolean میتوانند خروجی یک محاسبه هم باشند:

let isGreater = 4 > 1;

console.log( isGreater ); // true

و همانطور که در مثال بالا میبینید خروجی متغیر isGreater برابر با true هست و به ما میگه که 4 از یک بزرگتر هست.

مقدار Null

مقدار ویژه null متعلق به هیچکدام از تایپ هایی که در بالا توضیح دادیم نیست و یک نوع جدیدی هست که صرفا به یک مقدار تهی و خالی و یا ناشناخته اشاره میکنه و مقدار null در جاوااسکریپت بر خلاف سایر زبان های برنامه نویسی به یک چیزی که بطور کل وجود نداره اشاره نمیکنه.

let age = null;

مقدار Undefined

undefined هم مثل null یک مقدار ویژست و type مخصوص به خودش را داره. undefined به این معناست که هنوز هیچ مقداری تنظیم نشده و به متغیری گفته میشه که تعریف شده اما هنوز مقداری بهش منصوب نشده.

let age;

console.log(age); // "undefined"

یا میتونیم به متغیری که تعریف و مقدار دهی شده هم مقدار undefined را منصوب کنیم:

let age = 100;

age = undefined;

console.log(age); // "undefined"

اما پیشنهاد میشه در مواقعی چون مثال بالا از null بجای undefined استفاده کنید چراکه مقدار undefined بصورت پیشفرض برای متغیرهایی که بدون مقدار تعریف میشن در نظر گرفته میشه.

Object data types

Array

اولین data type از نوع object data type آرایه یا همان arrray هست. آرایه یک مجموعه مرتب از داده هاست.

یک آرایه فهرستی از داده های مختلف هست و توانایی این را داره تا انواع و اقسام داده هارا درون خودش ذخیره کنه و هر عضو از این آرایه را با نام یک element یا یک item میشناسیم و هر عضو هم یک جایگاه مخصوص به خود را داره که با نام index میشناسیم و تعداد کل آیتم ها و عضو های یک آرایه را هم با عنوان array length میشناسیم.

var myArray = [ 1, "hello world", { age:10 }, true ];

console.log( myArray[1]; // خروجی: "hello world"

به این نکته توجه داشته باشید که شمارش index یک آرایه از 0 شروع میشه و به همین خاطر هست که index شماره یک در مثال بالا برابر با " hello world " هست.

همچنین آرایه ها متدهای مختلفی مثل : map , filter , sort , find و .... را به همراه دارند که در درس های آینده به برسی بیشتر این نوع از داده میپردازیم.

Functions

هیچ برنامه نویسی نمیتونه اهمیت فانکشن هارا انکار کنه و فانکشن ها نقش کلیدی را در هر زبان برنامه نویسی ایفا میکنند.

برای تعریف اینکه فانکشن چی هست میتونیم بگیم که فانکشن یک قطعه ایی از کد را درون خودش نگه میداره تا زمانیکه ما به اون کد نیاز داشتیم، با صدا زدن یا بهتره بگیم invoke کردن اون فانکشن، قطعه کد مدنظر را اجرا کنیم.

ما میتونیم از کلمه function جهت ایجاد یک فانکشن استفاده کنیم:

function functionName() {
   // کد ما
}

و یا میتونیم از arrow function که در نسخه های جدیدتر به جاوااسکریپت اضافه شد بصورت زیر استفاده کنیم:

const myFunction = () => {
 // کد ما
};

همچنین در جاوااسکریپت فانکشن ها میتونن با نام یا بدون نام ( اصطلاحا anonymus ) باشن که ما در این مقاله فعلا با فانکشن های بدون نام کاری نداریم.

برای صدا زدن و اجرا کردن ( invoking ) یک فانکشن هم لازمه تا در جای مدنظر نام فانکشن را بنویسیم و در ادامه نام فانکشن یک جفت پرانتز (‌) به کار ببریم تا فانکشن مدنظر ما اجرا بشه.

function sayHello(){
  console.log( "Hello" );
};

sayHello(); // خروجی در کنسول: "Hello"

همچنین فانکشن ها این قابلیت را به ما میدن تا برای اونها یکسری پارامتر ها تعریف کنیم تا با هر بار اجرا کردن اون فانکشن بتونیم یکسری داده جدید را به فانکشن پاس بدیم و خروجی متفاوتی را بگیریم. برای مثال فانکشنی را در نظر بگیرید که دو عدد را به عنوان پارامتر های ورودی دریافت میکنه و اونهارو باهم جمع میکنه.

function sumNumbers(num1,num2){
  console.log( num1 + num2 );
};

sumNumbers(10,5); // خروجی: 15

به بخش های اضافی که موقع تعریف فانکشن در بین پرانتزها قرار میدیم پارامتر یا parameters میگیم و به مقادیری که موقع صدا زدن و اجرا کردن فانکشن دربین پرانتز ها قرار میدیم آرگومان یا argument میگیم.

همچنین انتظار میره تا هر فانکشن یک مقداری را return کنه تا ما بتونیم یک خروجی از کدها و محاسباتی که در بدنه یک فانکشن نوشته شده استفاده کنیم و اگر دریک فانکشن چیزی را return نکنیم، مقدار برگشتی آن فانکشن بصورت پیشفرض برابر با undefined خواهد بود.

function sumNumbers(num1,num2){
  return num1 + num2;
};

const myNumbersSum = sumNumbers(10,5);

console.log(myNumbersSum); // خروجی: 15

بخاطر داشته باشید که;کدهای نوشته شده در خط های بعد از return اجرا نخواهند شد.

function sumNumbers(num1,num2){
  return num1 + num2;
  console.log("hello");
};

const myNumbersSum = sumNumbers(10,5);

console.log(myNumbersSum); // خروجی: 15

Objects

ما بخش اعظمی از زمانمون را موقع کدنویسی با جاوااسکریپت صرف کار با object ها میکنیم.

object ها هسته اصلی جاوااسکریپت و بطور کل تمام زبان های OOP ( زبان های شئ گرا Object-oriented programming ) که حول مهور object ها ساخته شدن هستند. اما اصلا یه object چی هست ؟ یک object مجموعه ایی از ویژگی ها ( properties ) و متدهاست.

به زبانی ساده تر object را جعبه ایی در نظر بگیرید که میتونیم داده هامون را با یک کلید و یک مقدار در اون ذخیره کنیم.

حالا سینتکس به چه شکل هست و یک object را چطور میتونیم ایجاد کنیم ؟ برای ایجاد یک object باید از curly braces یا { } استفاده کنیم و در داخل اون مقادیر مدنظر را به شکل key : value بنویسیم:

// سینتکس کلی
{
   key1: value1,
   key2: value2,
   ...,
   keyN: valueN
}

// مثال واقعی
let person = {
  name: "John",
  age: 30,
  gender: "male",
  sayHello: function() {
    console.log("Hello!");
  }
};

و برای دسترسی به مقدار یکی از property های یک object میتونیم به 2 شکل زیر عمل کنیم:

console.log( person.name ); // خروجی: "John"
person.sayHello(); // خروجی: "Hello!"

console.log( person["name"]; // خروجی: "John"

برای اضافه کردن یک کلید جدید به object میتونیم به شکل زیر عمل کنیم:

person.family = "Wick";

console.log(person);
// خروجی
// {
//   name: "John",
//   age: 30,
//   gender: "male",
//   sayHello: function() {
//     console.log("Hello!");
//   },
//   family:"Wick",
// }

همچنین برای ویرایش یک مقدار قبلی هم به شکل زیر:

person.name = "Jack";

console.log(person);
// خروجی
// {
//   name: "Jack",
//   age: 30,
//   gender: "male",
//   sayHello: function() {
//     console.log("Hello!");
//   },
//   family:"Wick",
// }

بنابر این زمانیکه با استفاده از عملگر = مقداری را به یکی از کلیدهای یک object منصوب میکنیم، درصورتی که اون کلید از قبل در object ما وجود داشته باشه باعث میشه تا مقدار قبلی اون کلید جایگزین بشه با مقدار جدید و درصورتی که چنین کلیدی درobject وجود نداشته باشه هم باعث ایجاد یک کلید جدید در آن object میشه.

عملگر typeof

عملگر typeof برای ما type مقدار پرسیده شده را برمیگردونه و این میتونه زمانی مفید باشه که نیاز به یک چک کردن سریع تایپ یک متغیر داریم و یا میخواهیم طبق تایپ های مختلف و بصورت شرطی کاری را انجام بدیم:

typeof undefined // "undefined"

typeof 0 // "number"

typeof 10n // "bigint"

typeof true // "boolean"

typeof "foo" // "string"

typeof Symbol("id") // "symbol"

typeof Math // "object"  (1)

typeof null // "object"  (2)

typeof alert // "function"  (3)

سه مورد آخر شاید نیاز به توضیح بیشتر داشته باشند:

1. Math در واقع یک object هست که از پیش توسط جاوااسکریپت جهت انجام یکسری محسابات و عملیات های ریاضی طراحی شده.
2. خروجی typeof null برابر با "object" هست. این یک خطا و یک ارور رسمی و شناخته شده در جاوااسکریپت هست و از آنجایی که میدونیم null یک مقدار ویژه هست و تایپ مختص به خود را داره، خروجی typeof null در اینجا اشتباه هست.
3. خروجی typeof alert برابر با "function"  هست و alert هم واقعا یک function هست اما هیچ تایپ ویژه و تنهایی به اسم function وجود نداره و خود function ها در واقع object هستند ( که در مقالات بعدی بطور کامل توضیح میدیم ) اما در عملگر typeof به این شکل تعریف شده که یک function را با همان typeof برابر با function به ما نشان بدن.