مروری بر آنگولار جی اس – آموزش AngularJS

مروری بر آنگولار جی اس (AngularJS)

AngularJS چیست؟

آنگولار جی اس (AngularJS) یک فریم ورک متن باز برای برنامه های تحت وب می باشد. فریم ورک AngularJS در سال 2009 توسط Misko Hevery و Adam Abrons توسعه داده شده است. در حال حاضر گوگل مسئول توسعه و نگهداری این فریم ورک می باشد. نسخه 1.4.3 آخرین نسخه منتشر شده از این فریم ورک است.

تعریف که برای AngularJS در اسناد رسمی آن مطرح شده است به شرح زیر است:

AngularJS یک فریم ورک ساختاری برای برنامه های تحت وب پویا می باشد. این فریم ورک به توسعه دهندگان اجازه می دهد تا با توسعه Syntax زبان نشانه گذاری HTML، واحدهای کاربردی برنامه خود را به روشنی بیان کنید. مباحث Data Binding و Dependency Injection در فریم ورک AngularJS باعث کاهش میزان کد های نوشته شده در برنامه های عادی می شود. و همه این موارد به صورت Client-Side یعنی سمت کاربر اجرا می شوند و آن را به یک شریک ایده آل برای تکنولوژی های سمت سرور تبدیل می کند.

ویژگی ها

• AngularJS یک فریم ورک پیشرفته مبتنی بر جاوا اسکریپت است که برای ایجاد برنامه تحت وب قدرتمند استفاده می شود.
• با استفاده از AngularJS می توانید برنامه هایی تولید کنید که به صورت Clinet-Side کار می کنند و مسیر توسعه این برنامه نیز مانند MVC یک مسیر ساده و مشخص است.
• برنامه ایجاد شده توسط فریم ورک AngularJS با همه مرورگر ها سازگار هستند زیرا AngularJS به صورت خودکار کد های جاوا اسکریپت را متانسب با هر مرورگر پردازش می کند.
• این فریم ورک رایگان و متن باز می باشد و به همین دلیل هزاران نفر در دینا آن را توسعه می دهند.

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

ویژگی های اصلی

در زیر ویژگی های مهم و اصلی فریم ورک AngularJS را مشاهده می کنید:

• Data-binding : این ویژگی به صورت خودکار اطلاعات را بین اجزای Model و View همگام سازی می کند.
• Scope : شیء هایی هستند که به Model اشاره می کنند. آن ها مانند چسب بین Controller و View عمل می کنند.
• Controller : این ها توابع جاوا اسکریپت هستند که به حوزه (scope) خاص محدود می شوند.
• Services : فریم ورک AngularJS با چندین سرویس درون ساخته ارائه شده است برای نمونه XMLHttpRequests آن ها به صورت اشیای Singleton هستند یعنی فقط یک بار در برنامه معرفی می شوند.
• Filters : این ویژگی زیر مجموعه ای از آرایه را انتخاب می کند و یک آرایه جدید را باز می گرداند.
• Directives : این ویژگی نشانگرهای عناصر DOM (مانند عناصر، attributes، CSS و غیره) هستند. از این ویژگی می توان برای ایجاد تگ های HTML سفارشی که به عنوان ویدجت های جدید و سفارشی استفاده می شوند، استفاده کرد. AngularJS دارای دستورات درون ساخت مانند (ngBind، ngModel و غیره) می باشد .
• Templates : هنگامی که یک View همراه با داده های دریافتی از Controller و Model رندر می شود، به یک قالب (Templeate) تبدیل می گردد که حاصل کار می تواند فقط شامل یک فایل (همچون html) باشد و یا view های مختلفی که در یک صفحه وجود دارند.
• Routing : مفهوم آن سویچ کردن بین view ها می باشد.
• Model View Whatever : در واقع MVC یک الگوی طراحی برای تقسیم کردن یک برنامه به بخش های مختلف (به نام Model، View و Controller) است که هر کدام دارای مسئولیت های متمایز هستند. AngularJS ، MVC را به معنای سنتی اجرا نمی کند، بلکه چیزی نزدیک به MVVM (Model-View-ViewModel) است.
• Deep Linking : این ویژگی به شما اجازه می دهد که وضعیت برنامه را در URL رمزگذاری کنید تا بتوان آن را نشانه گذاری کرد. پس از آن برنامه می تواند از URL به همان وضعیت سابق بازگردانده شود.
• Dependency Injection : فریم ورک AngularJS یک زیر سیستم درون ساخت دارد که به توسعه دهندگان برای راحت تر کردن کار توسعه و تست برنامه کمک زیادی می کند.

نمودار اجزای مهم فریم ورک AngularJS

نمودار زیر برخی از اجزای مهم فریم ورک AngularJS را نشان می دهد که در بخش های بعدی به طور مفصل بررسی می شوند.

مزایای AngularJS

• AngularJS قابلیت ایجاد برنامه های تک صفحه ای با یک روش بسیار تمیز و قابل نگهداری فراهم می کند.
• AngularJS توانایی data binding به HTML فراهم می کند، بنابراین کاربر به یک تجربه غنی می دهد.
• کد های AngularJS قابلیت تست دارند.
• AngularJS از قابلیت dependency injection پشتیبانی می کند.
• AngularJS اجزای قابل استفاده مجدد را فراهم می کند.
• با AngularJS، توسعه دهنده در ازای نوشتن کد کمتر عملکرد بهتری را کسب می کند.
• در AngularJS، views به صورت HTML می باشند و Controller ها در جاوا اسکریپت نوشته می شوند.

مهمتر از همه، برنامه های AngularJS می توانند بر روی تمام مرورگرهای اصلی و تلفن های هوشمند از جمله تلفن های همراه و تبلت های اندروید و iOS اجرا شوند.

معایب AngularJS

اگر چه فریم ورک AngularJS ویژگی های زیادی دارد. اما مانند هر برنامه دیگر آن هم معایبی دارد که عبارت اند از:

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

اجزا و کامپوننت های AngularJS

فریم ورک AngularJS را می توان به سه بخش عمده زیر تقسیم کرد:

• ng-app
• ng-model
• ng-bind

ng-app

این دستورالعمل AngularJS را در تعریف می کند (یک برنامه AngularJS را به HTML پیوند می دهد).

ng-model

این دستورالعمل مقادیر داده های برنامه AngularJS را به کنترل های ورودی HTML متصل می کند.

ng-bind

این دستور، داده های برنامه AngularJS را به تگ های HTML متصل می کند.