JavaScript یک زبان برنامه نویسی شی گرا است که در بسیاری از موارد مورد استفاده قرار می گیرد . در این مقاله توضیحات جامعی ارائه شده است .

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

1 . غنی سازی صفحه وب توسط

- ایجاد محتوای HTML مرورگر خاص یا CSS

- درج محتوای HTML پویا

-  تولید جلوه های ویژه صوتی و تصویری ( انیمیشن)

2 . غنی سازی رابط کاربر وب توسط

- پیاده سازی عناصر رابط کاربری پیشرفته

-  اعتبار سنجی ورودی کاربر در سمت سرویس گیرنده ( Client)

- پر کردن  فرم های خاص بصورت خودکار

3 . اجرای نرم افزار وب با ذخیره سازی داده های محلی یا از راه دور

4 . اجرای عناصر وب سمت کاربر  برای نرم افزار وب توزیع شده برای ذخیره سازی داده های از راه دور که توسط عناصر سمت سرور مدیریت  می شود که یک برنامه سمت سرور می باشد و قبلا  توسط زبان های سمت سور مانند PHP ، JAVA یا #C نوشته شده است . اما امروزه در JavaScript توسط NodeJS نوشته می شود .

5 . اجرای یک نرم افزار وب توزیع شده کامل جایی که عناصر سمت کاربر و سمت سرور هردو برنامه JavaScript هستند .

JavaScript شی گرا است ،اما در راه های مختلف زبان برنامه نویسی شی گرای قبلی مانند Java و #C است. دراینجا مفهوم واضح کلاس در JavaScript وجود ندارد . ترجیحا ، کلاس ها بصورت اشیاء خاص تعریف می شوند : به عنوان توابع سازنده یا اشیاء .

اگر چه شی می تواند بدون کلاس ایجاد شود . در زمان اجرا ، جزئیات و متد ها می توانند اضافه ، حذف  از هر شی یا کلاس اضافه یا حذف شود ، مانند تعریف خودتان از مفاهیم کلاس یا شمارش .

انواع و اطلاعات حقیقی در JavaScript

JavaScript دارای سه نوع داده اصلی می باشد که String ، Number  و Boolean می باشند .

سه نوع بازگشتی نیز دارد که شامل Object ، array و function می باشند . آرایه ها و توابع نوعی خاص از شی می باشد . انواع از زمانی که برنامه جاوااسکریپت کامپایل نمی شود بررسی نمی گردند . تبدیل نوع بصورت خودکار انجام می شود .

ممکن است مقدار متغیر چنین باشد :

- یک مقدار داده : رشته ای (string) ، عددی ( number ) یا Boolean .

- شی بازگشتی ، مراجعه به شی ، آرایه یا تابع .

- یکی از دو مقدار داده خاص تعریف نشده یا null می باشد .

همه مقادیر داده های عددی در فرمت نقطه شناور 64 بیتی با نمونه انتخابی نمایش داده می شوند مانند داده عددی حقیقی 3.1e10 . هیچ نوع صریح تمایز بین اعداد صحیح و اعداد ممیز شناور وجود ندارد . برای اینکه مطمئن شوید که مقدار عددی از نوع صحیح است مقدار رشته ای که بصورت عدد نمایش داده شده به مقدار عددی ( Integer ) تبدیل شود ، یکبار  تابع از پیش تعریف شد هParseInt را بکار ببریم . اگر عبارت عددی نمیتواند با عدد ارزیابی شود،مقدار آن برابر NaN خواهد بود .

مثلا در جاوا دو مقدار حقیقی از پیش تعریف شده وجود دارد ، True و False . و Booleanعلامت !برای NOT ، && برای AND و  || برای OR .زمانیکه  یک مقدار غیر Boolean در شرط یا به عنوان یک عملگر عبارت Boolean استفاده شود ، براساس این قوانین به Boolean  تبدیل شده اند .یک رشته خالی ، داده حقیقی 0 ، همچنین تعریف نشده و null است ، برابر False است و بقیه مقادیر برابر True هستند .

برای تست مساوی یا نامساوی  بودن، همیشه  از نماد برابری === و !== بجای == و != استفاده می شود.در غیر این صورت،برای مثال، 2 برابر "2" است از آنجایی که شرط (2=="2") در جاوا اسکریپت  برابر True  می شود .

اختصاص یک آرایه خالی حقیقی ، به عنوان مثال []=Var a مانند بکار گرفتن ()Object است . بطوریکه   var o =new object() . توجه داشته باشید،اگرچه، یک شی حقیقی خالی{} واقعا خالی نیست، بطوریکه ، شامل مشخصه یا متد هایی است که از Object.prototype ارث بری کرده است . برای ایجاد شی که هیچ شکافی نداشته باشد ، Object.create(null) می تواند استفاده شود .

دامنه متغیر

در نسخه فعلی جاوا اسکریپت، ECMAScript 5 ، دو دامنه برای متغیر ها وجود دارد : دامنه سراسری (Global) و دامنه مخصوص یک تابع ،اما نه این دامنه . بنابراین، اعلام یک متغیر درون یک محدود گمراه کننده است و باید از آن اجتناب شود . برای مثال،اگرچه اغلب از الگو استفاده می شود،حتی توسط برنامه نویسان با تجربه جاوا اسکریپت، یک تله برای اعلام متغیر حلقه های تو در تو وجود دارد ، مانند :

function foo() {
  for (var i=0; i < 10; i++) {
    ...  // do something with i
  }
}

برای نحوه تفسیر این کد توسط جاوا اسکریپت باید چنین بنویسیم :

function foo() {
  var i=0;
  for (i=0; i < 10; i++) {
    ...  // do something with i
  }
}

همه متغیر ها باید در اغاز تابع اعلام شوند فقط در نسخه بعدی جاوا اسکریپت ECMAScript 6 ،محدوده بلوک با شکل جدید اعلام متغیر با کلمه کلیدی Let  پشتیبانی می شود .

حالت محدودیت

از شروع ECMAScript 5 ، از حالت محدودیت (Strict Mode) برای دریافت بیشتر زمان اجرا بررسی خطا استفاده می شود . برای مثال ، در حالت محدودیت، همه متغیر ها باید اعلام شوند .

می توانیم از حالت محدودیت با نوشتن عبارتی مانند عبارت زیر در اولین خط فایل جاوا اسکریپت یا داخل <Script>.

'use strict';

بطور کلی استفاده از حالت محدودیت توصیه می شود مگر اینکه کدهای شما براساس کتابخانه باشد .

انواع مختلف شی (Object)

شی در جاوا اسکریپت با شی در شی گرا یا UML تفاوت دارد . به نمونه ای از کلاس نیاز ندارد . میتوانید متد خود را داشته باشید . علاوه بر این ممکن است دارای بخش key-value باشد .بنابراین ، ممکن است دارای 3 بخش مختلف باشند  در حالیکه اشیاء قبلی فقط دارای بخش تنظیمات هستند .

var person1 = { lastName:"Smith", firstName:"Tom"};
var o1 = Object.create( null);  // an empty object with no slots

هرجاییکه name در یک بخش باشد شناسه قابل قبول در جاوا اسکریپت است ، ممکن است دارای بخش تنطیمات،متد یا مقادیر باشددر غیر این صورت اگر name نوعی دیگر از رشته باشد نشان دهنده بخش مقادیر می باشد که عناصر نقشه می باشد همانطور که در اینجا توضیح داده می شود :

نام در بخش متد نشانگر یک تابع جاوا اسکریپت است و مقدار آن متن تعریف تابع است .

ویژگی های شی در 2 راه قابل دسترس هستند .

1 . استفاده از علامت نقطه (مانند Java و ++C )

person1.lastName = "Smith"

2 . استفاده از علامت map

person1["lastName"] = "Smith"

شی جاوااسکریپت می تواند در راه های مختلف برای اهداف بسیار استفاده شود . در اینجا 5 مورد استفاده برای شی در جاوا اسکریپت می باشد :

1 . record مجموعه ای از تنظیمات بخش بندی است به مثتپال زیر توجه کنید:

var myRecord = {firstName:"Tom", lastName:"Smith", age:26}

2 . map ازمقادیر look-ups بر اساس کلید پشتیبانی می کند . برای مثال :

var numeral2number = {"one":"1", "two":"2", "three":"3"}

مقدار "1" را به کلید one و "2" را به Two ربط می دهد . یک کلید نیاز ندارد یک شناسه معتبر جاوا اسکریپت باشد اما می تواند هر نوع رشته ای باشد .

3 . یک untyped object نمونه ای از کلاس نیست،ممکن است دارای بخش تنظیمات یا توابع باشد . برای مثال :

var person1 = { 
  lastName: "Smith", 
  firstName: "Tom",
  getInitials: function () {
    return this.firstName.charAt(0) + this.lastName.charAt(0); 
  }  
};

4 . namespace ممکن است در شکل یک شی untyped تعریف شود و توسط یک متغیر سراسری باز گردانده شود ،اسمی که پیشوند namespace را نشان می دهد .برای مثال ، متغیر شی زیر فضای نام اصلی یک نرم افزار را بر اساس الگوی معماری  MVC (که اختصار یافته Model-View-Controller می باشد) جایی که دارای سه زیرمجموعه ی فضای نام است که با سه بخش از یک نرم افزار MVC متناظر است :

var myApp = { model:{}, view:{}, ctrl:{} };

لیست های آرایه ( Array lists )

یک آرایه جاوا اسکریپت در واقع ساختار منطقی اطلاعات یک لیست آرایه را نشان می دهد که عناصر آرایه توسط شماره آن ها قابل دسترسی هستند . استفاده از آرایه بدون تعیرف  آرایه جاوا اسکریپت ابهام ایجاد می کند. اما برای سهولت ، اغلب به جای آرایه جاوا اسکریپت می گوییم آرایه .

یک متغیر ممکن است با آرایه حقیقی جاوا اسکریپت مقدار دهی شود :

var a = [1,2,3];

به دلیل اینکه لیست  های آرایه هستند، آرایه هلی جاوا اسکریپت می توانند بصورت پویا عمل کنند : ممکن است از index ها که بزرگتر از طول آرایه است استفاده کند . برای مثال ، بعد از مقدار دهی اولیه متغیر ، آرایه که توسط متغیر a که طول آن برابر 3 است ، اما هنوز می توانیم 5 عنصر به آرایه اختصاص دهیم:

a[4] = 7;

محتوای آرایه a با کمک استانداردی برای حلقه با شمارنده که از اولین index تا آخرین  را شمارش می کندپردازش می کند که a.length-1 است  .

for (i=0; i < a.length; i++) { ...}

از آنجایی که آرایه ها نوعی خاص از Object هستند ، اغلب برای دریافت نیاز به یک متد داریم اگر متغیر یک آرایه نشان دهد . می توانیم بررسی کنیم، اگر متغیر a یک آرایه با بکار بردن  نوع از پیش تعریف شده isArray  مانند (Array.isArray(a است .

برای افزودن یک عنصر جدید به آرایه ، آن را باز کرده و از عملگر push استفاده کنید :

a.push( newElement);

برای حذف یک عنصر در موقعیت i از  آرایه a ، از متد آرایه از پیش تعریف شده splice مانند زیر استفاده می کنیم :

a.splice( i, 1);

برای جستجوی مقدار v  در آرایه a می توانیم از متد از پیش تعریف شده indexOf که موقعیت را باز می گرداند استفاده کنیم .

if (a.indexOf(v) > -1)  ...

برای ایجاد حلقه در آرایه a،دو گزینه وجوددارد :حلقه For یا متد آرایه forEach . می توانیم از حلقه For مانند زیر استفاده کنیم :

var i=0;
for (i=0; i < a.length; i++) {
  console.log( a[i]);
}

اگر عملکرد مهم نیست ، این است که، اگر a به اندازه کافی کوچک باشد می توانیم از متد آرایه از پیش تعریف شده forEach استفاده کنیم ، همانطور که در مثال زیر مشاهده می کنید ، پارامتر elem مجددا فرض می کند که هر عنصر آرایه a به عنوان مقدارخود است :

a.forEach( function (elem) {
  console.log( elem);
}) 

نقشه (Map)

نقشه (Map) بازنمایی از کلید ها برای مقادیر فراهم می کند . کلید های نقشه جاوا اسکریپت رشته ی حقیقی هستند که ممکن است شامل فضای خالی نیز باشد :

var myTranslation = { 
    "my house": "mein Haus", 
    "my boat": "mein Boot", 
    "my horse": "mein Pferd"
}

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

(Object.Keys(m وارد حلقه می شوند که همه کلیذ های نقشه m آرایه را باز می گرداند. برای مثال :

var i=0, key="", keys=[];
keys = Object.keys( myTranslation);
for (i=0; i < keys.length; i++) {
  key = keys[i];
  alert('The translation of '+ key +' is '+ myTranslation[key]);
}

برای افزودن ورودی جدید به یک نقشه ،مقدار جدید را با کلید به هم متصل می کنیم :

myTranslation["my car"] = "mein Auto";

برای حذف یکورودی از یک نقشه ، از عملگر از پیش تعریف شده delete استفاده می کنیم :

delete myTranslation["my boat"];

برای جستجو در یک نقشه ، اگر شامل یک ورودی برای مقدار کلید حتمی ، مثلا برای بررسی ، اگر نقشه شام یک ورودی برای "my bike" باشد :

if ("my bike" in myTranslation)  ...

برای ایجاد حلقه بر روی نقشه m ، در ابتدا با کمک متد Object.Keys آن را به یک آرایه تبدیل می کنیم سپس می توانیم از حلقه For  یا متد forEach استفاده کنیم .مثال زیر نحوه ایجاد حلقه با For را نشان می دهد :

var i=0, key="", keys=[];
keys = Object.keys( m);
for (i=0; i < keys.length; i++) {
  key = keys[i];
  console.log( m[key]);
}

مجددا،اگر m به اندازه کافی کوچک باشد ، می توانیم از متد forEach استفاده کنیم :

Object.keys( m).forEach( function (key) {
  console.log( m[key]);
}) 

Java Script از چهار نوع ساختار  داده اصلی پشتیبانی می کند

بطور خلاصه ، این چهار ساختار از موارد زیر پشتیبانی می کنند:

1 . لیست های آرایه (array list) ، مانند ["one" , "two" ,"three"] که object های خاص جاوا اسکریپت هستند و آرایه نامیده می شوند ، اما از آنجایی پویا هستند ، بیشتر لیست های آرایه که در زبان برنامه نویسی جاوا تعریف شده است .

2 . Record ، که object های خاص جاوا اسکریپت هستند ، مانند {FirstName :"Jhon", " LsatTime :"Smit }
.

3 . جدول ،که نقشه های خاص هستند جاییکه مقادیر ورودی رکورد ها با ID خاص ، مانند اینکه کلید نقشه IDهای استاندارد رکورد های ورودی هستند .

توابع (functions)

توابع در جاوا اسکریپت object های خاص هستند . همانطور کهمی توانند در متغیر ذخیره شوند ، به عنوان یک اصل، توسط توابع باز گردانده می شود و می تواند بصورت پویا تغییر یابد . فرض کنید توابع شهروندان درجه یک هستند و جاوااسکریپت می تواند به عنوان زبان برنامه نویسی کاربردی نمایش داده می شود .

شکل کلی تعریف تابع یک ارجاع توابع به یک متغیر است :

var myFunction = function theNameOfMyFunction () {...}

جاییکه theNameOfMyFunction انتخابی است زمانی که حذف شود تابع ناشناس است . در هر صورت ، توابع با متغیری که تابع را باز می گرداند  به کار گرفته می شود . در مورد فوق،توابع با () myFunction به کار گرفته شود نه با theNameOfMyFunction .

تابع ناشناس در زبان برنامه نویسی عبارت lambda نامیده می شود .

مثالی از تابع ناشناس که ارسال آرگومان در تابع است . می توانیم یک مقایسه تابع ارسال شده به تابع از پیش تعریف شده sort برای مرتب کردن عناصر لیست آرایه انجام دهیم . مانند تابع مقایسه که باید مقدار منفی بازگرداند اگر اولین آرگومان از بعدی کوچکتر باشد . 0 برمی گرداند اگر هر دو آرگومان ها در یک ردیف باشند و باید یک عدد مثبت بازگرداند اگر دومین آرگومان کوچکتر از اولی باشد . به مثال زیر توجه کنید :

var list = [[1,2],[1,3],[1,1],[2,1]]; 
list.sort( function (x,y) { 
  return ((x[0] === y[0]) ? x[1]-y[1] : x[0]-y[0]);
});

یک اعلام تابع به شکل زیر می باشد :

function theNameOfMyFunction () {...}

این برابر نام تابع تعریف شده است :

var theNameOfMyFunction = function theNameOfMyFunction () {...}

هر دو یک تابع با نام theNameOfMyFunction و متغیر theNameOfMyFunction این تابع را باز می گرداند.

توابع جاوا اسکریپت می توانند توابع  داخلی داشته باشند . مکانیزم closure در جاوا اسکریپت اجازه دسترسی کامل به متغیر ها خارج از محدوده را می دهد .

گزینه بکارگرفته شده توابع جاوا اسکریپت می توانند برای دسترسی به مکانیزم فضای نام که فراتر از استفاده شی فضای نام برابر است ، استفاده شوند، از انجایی که می تواند متغیر ها و متد های سراسری را کنترل کند . درمثال زیر ، یک فضای نام برای دستورات بخشی از یک نرم افزار تعریف کردیم که در معرض متغیر ها و کلاس ها در شکل توابع سازنده قرار دارند .

myApp.model = function () {
  var appName = "My app's name";
  var someNonExposedVariable = ...;
  function ModelClass1 () {...}
  function ModelClass2 () {...}
  function someNonExposedMethod (...) {...}
  return {
    appName: appName,
    ModelClass1: ModelClass1,
    ModelClass2: ModelClass2
  }
}();  // immediately invoked

تعریف و استفاده از کلاس ها

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

دراینجا مفهوم واضح کلاس در جاوا اسکریپت بیان نشده است . با این وجود، کلاس ها در دو روش تعریف می شوند :

1 . در شکل توابع سازنده که اجازه میدهد یک نمونه جدید از کلاس با عملگر new ایجاد شود . این ها روش های قدیمی پیشنهاد شده در Mozilla JavaScript documents است .

2 . در شکل یک شی که از متد از پیش تعریف شده Object.create برای ایجاد یک نمونه جدید کلاس استفاده می کند . در این روش ، سازنده براساس مکانیزم ارث بری می بایست با مکانیزم های دیگر جایگزین شود .

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

کلاس های براساس سازنده

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

function Person( first, last) {
  this.firstName = first; 
  this.lastName = last; 
}

مرحله بعد متدهای سطح نمونه کلاس را به عنوان بخشی از مشخصه سازنده prototype تعریف کنید :

Person.prototype.getInitials = function () {
  return this.firstName.charAt(0) + this.lastName.charAt(0); 
}

مرحله آخر ، متدهای سطح کلاس("Static") می توانند به عنوان بخش متد سازنده تعریف شوند :

Person.checkName = function (n) {
  ... 
}

نمونه ای از کلاس بر اساس سازنده توسط اجرای عملگر جدید new برای تابع سازنده ایجاد شده است و آرگومان های مناسب برای پارامترهای سازنده فراهم می کند :

var pers1 = new Person("Tom","Smith");

متد getInitials در شی pars1 از نوع person با استفاده از نقطه بکار گرفته شده است :

alert("The initials of the person are: " + pers1.getInitials());

زمانی که شی o با o=new c ایجاد شد ، که c نام تابع می باشد ، کلاسی بنام o می تواند با عبارت داخلی o.constructor.name که "c" را باز میگرداند بازیابی شود ( اگرچه مشخصه name تابع تا کنون توسط Internet Explorer هم پشتیبانی نمی گردد .

در روش براساس سازنده ، مکانیزم متد ارث بری که توسط مشخصه از پیش تعریف شده تابع سازنده که prototype نام دارد ارائه می گردد . از آنجایی که در این روش خصوصیات با هیچ meta-data تعریف نشده اند .، آن ها مانند متد ارث بری نمی کنند .

کلاس های Factory-based

در این روش شی person  جاوا اسکریپت را تعریف می کنیم با متد create که متد از پیش تعریف شده object.create را برای ایجاد شی از نوع person بکار می برد :

var Person = {
  typeName: "Person",
  properties: {
    firstName: {range:"NonEmptyString", label:"First name", 
        writable: true, enumerable: true},
    lastName: {range:"NonEmptyString", label:"Last name", 
        writable: true, enumerable: true}
  },
  methods: {
    getInitials: function () {
      return this.firstName.charAt(0) + this.lastName.charAt(0); 
    }
  },
  create: function (slots) {
    // create object
    var obj = Object.create( this.methods, this.properties);
    // add special property for *direct type* of object
    Object.defineProperty( obj, "type", 
        {value: this, writable: false, enumerable: true});
    // initialize object
    Object.keys( slots).forEach( function (prop) {
      if (prop in this.properties) obj[prop] = slots[prop];
    })
    return obj;
  }
};

توجه داشته باشید که شی person جاوا اسکریپت بطور واقع یک کلاس factory-based را نشان می دهد که با بکارگیری متد create ایجاد شده است .

var pers1 = Person.create( {firstName:"Tom", lastName:"Smith"});

متد getInitials در شی parse1 از نوع person با استفاده از نقطه بکار گرفته شده است .

alert("The initials of the person are: " + pers1.getInitials());

توجه داشته باشید که اعلام هر مشخصه برای یک شی با object.create ایجاد شده است که شامل توصیفگر های writable : true و enumerable : true می باشد . مانند خط 5 و 7 در تعریف شی person در مثال بالا .

در روش کلی ، بطور مثال در کتابخانه mODELcLASSjs برای توسعه مبتنی بر مدل نمی توانیم مجددا در هر کلاس متد create  را تعریف کنیم، اما یک تابع سازنده کلی برای تعریف کلاس هاس factory-based داریم . مانند mODELcLASS که مکانیزم ارث بری را به هم پیوستن متد ها و خصوصیات با متد ها و خصوصیات کلی،فراهم می کند .

جاوا اسکریپت به عنوان یک زبان برنامه نویسی شی گرا

JavaScript شی گرا است،اما در روش متفاوتی از زبان برنامه نویسی شی گرای قبلی مانند جاوا و ++C می باشد . ترجیحا کلاس ها در شکل شی خاص تعریف می شوند ،همچنین به عنوان تابع سازنده یا شی .

اگرچه، object ها می توانند بدون نمونه کلاس ایجاد شوند،در مواردی که نوع آن هاتعریف  نشده و خصوصیات مانند متد ها می توانند برای objectهای خاص تعریف شوند . در زمان اجرا ، خصوصیات و متد ها می توانند از یک شی یا کلاس اضافه یا حذف شوند