طراحی سایت و برنامه نویسی

آموزش طراحی سایت و برنامه نویسی

طراحی سایت و برنامه نویسی

آموزش طراحی سایت و برنامه نویسی

آموزش Node.js: برنامه نویسی ناهمگام و Callback — بخش هفتم

جاوا اسکریپت به صورت پیش‌فرض یک زبان برنامه‌نویسی همگام و تک نخی است. این بدان معنی است که کد نمی‌تواند نخ‌های جدیدی ایجاد کرده و به صورت موازی اجرا شود. در این مقاله به بررسی روش‌های مختلف برنامه نویسی ناهمگام در محیط Node.js می‌پردازیم. برای مطالعه بخش قبلی این سری مقالات به لینک زیر رجوع کنید:

ناهمگامی در زبان‌های برنامه‌نویسی

رایانه‌ها اساساً دارای طراحی ناهمگام هستند. منظور از ناهمگامی این است که کارهای مختلف می‌توانند در گردش برنامه اصلی مستقل از هم اتفاق بیفتند. در رایانه‌های امروز هر برنامه‌ای برای مدت زمان معینی اجرا می‌شود و سپس اجرای آن متوقف می‌شود تا برنامه دیگری بتواند به اجرای خود ادامه بدهد. این کار در چنان چرخه سریعی اتفاق می‌افتد که کاربر هرگز متوجه نمی‌شود و ما فکر می‌کنیم رایانه ما می‌تواند به طور همزمان برنامه‌های زیادی را اجرا کند، اما این یک توهم است (البته قضیه در پردازنده‌های چندهسته‌ای متفاوت است).

برنامه‌ها به صورت داخلی از «وقفه» (interrupt) استفاده می‌کنند. وقفه یک سیگنال است که به سمت پردازنده ارسال می‌شود تا توجه سیستم را کسب کند. پرداختن به جزییات این موضوع خارج از موضوع این مقاله است؛ اما باید به خاطر داشته باشید که ناهمگامی در برنامه‌ها امری معمول است و به طور نرمال برنامه‌ها، اجرای خود را متوقف می‌کنند تا زمانی که پردازنده به آن‌ها وقتی اختصاص بدهد. زمانی که یک برنامه منتظر پاسخی از سوی شبکه است، نمی‌تواند پردازنده را معطل خود نگه دارد تا درخواست پایان یابد.

به طور معمول زبان‌های برنامه‌نویسی همگام هستند. برخی از آن‌ها نیز در حد زبان یا کتابخانه‌های جانبی، روش‌هایی برای مدیریت ناهمگامی ارائه می‌کنند. زبان‌های C ،Java ،C# ،PHP ،Go ،Ruby ،Swift و Python همگی به صورت پیش‌فرض همگام هستند. برخی از این زبان‌ها با استفاده از نخ‌ها به صورت ناهمگام عمل می‌کنند و می‌توانند یک پردازش جدید ایجاد کنند.

جاوا اسکریپت

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

اما می‌دانیم که جاوا اسکریپت درون مرورگر تولد یافته است و وظیفه اصلی آن در ابتدا پاسخ دادن به واکنش‌های کاربر مانند onClick ،onMouseOver ،onChange ،onSubmit و غیره بوده است. چنین فرایندی در یک مدل برنامه‌نویسی همگام چگونه ممکن است؟

پاسخ در محیط برنامه‌نویسی این زبان است. مرورگر روشی برای ارائه یک مجموعه از API-ها دارد که می‌توانند این نوع کارکرد را مدیریت کنند. در سال‌های اخیر Node.js یک محیط غیر مسدودکننده I/O معرفی کرده است که این مفهوم را به دسترسی فایل‌ها، فراخوانی‌های شبکه و موارد مشابه گسترش داده است.

Callback-ها

ما هرگز نمی‌دانیم که یک کاربر چه زمانی روی یک دکمه کلیک خواهد کرد، بنابراین باید یک «دستگیره رویداد» (event handler) برای رویداد کلیک تعریف کنیم.

این دستگیره رویداد تابعی قبول می‌کند که هنگام اتفاق افتادن رویداد فراخوانی می‌شود:

این همان callback مشهور است. در واقع callback تابع ساده‌ای است که به صورت یک مقدار به تابع دیگر ارسال می‌شوند و تنها زمانی اجرا خواهد شد که رویدادی اتفاق بیفتد. ما این کار را به این دلیل می‌توانیم اجرا کنیم که جاوا اسکریپت تابع‌های درجه نخست دارد که می‌توانند به متغیرها انتساب یافته و به تابع‌های دیگر (که تابع‌های درجه بالا نامیده می‌شوند) ارسال شوند.

رویه معمول این است که کد کلاینت در یک شنونده رویداد load در شیء window قرار می‌گیرد و تابع callback را در زمان آماده شدن صفحه اجرا می‌کند:

Callback-ها در همه جا استفاده می‌شوند و اختصاص به رویدادهای DOM ندارند. یک مثال عمومی استفاده از تایمر است:

درخواست‌های XHR نیز یک callback می‌پذیرند. در مثال زیر یک تابع به مشخصه‌ای که در زمان رخداد اتفاق خاص فراخوانی می‌شود، انتساب خواهد یافت:

مدیریت خطا در Callback-ها

یکی از رایج‌ترین راهبردها برای مدیریت خطا در callback-ها کاری است که Node.js انجام می‌دهد. پارامتر اول در هر تابع callback شیء خطا است که به نام callback-های error-first شناخته می‌شوند.

اگر خطایی وجود نداشته باشد، این شیء null خواهد بود. اگر خطایی رخ داده باشد این پارامتر نوعی توضیح در مورد خطا و اطلاعات مرتبط ارائه می‌کند.

مشکل Callback-ها

Callback-ها در استفاده‌های ساده بسیار عالی هستند. اما هر Callback یک سطح به سلسله‌مراتب تودرتو اضافه می‌کند. زمانی که Callback-های زیادی وجود داشته باشند، کد به سرعت پیچیده می‌شود:

این کد صرفاً 4 سطح ساده دارد، اما در موارد زیادی سطوح بسیار بیشتری از کد تودرتو را مشاهده می‌کنیم که جالب نیست. برای حل این مشکل چه باید کرد؟

جایگزین‌های Callback-ها

از ES6 به بعد جاوا اسکریپت چند قابلیت معرفی کرده است که به کدنویسی ناهمگام بدون استفاده از Callback-ها کمک می‌کند:

  • Promises (ES6)
  • Async/Await (ES8)

Promise-ها

Promise-ها یک روش برای اجرای کد ناهمگام در جاوا اسکریپت محسوب می‌شوند و با استفاده از آن‌ها دیگر لازم نیست نگران وجود Callback-های زیاد در کد باشیم.

مقدمه‌ای بر Promise-ها

یک Promise عموماً به صورت واسطی برای یک مقدار تعریف می‌شود که در زمانی در آینده موجود خواهد شد. با این که سال‌هاست Promise-ها معرفی شده‌اند اما صرفاً در ES2015 استاندارد و معرفی شدند و هم اکنون در ES2017 با معرفی تابع‌های async منسوخ گشته‌اند. تابع‌های async از API مربوط به Promise ها به عنوان بلوک‌های سازنده خود استفاده می‌کند و از این رو درک آن‌ها حتی در صورتی که بخواهید در کد خود از تابع‌های async به جای promise استفاده کنید ضروری خواهد بود.

طرز کار Promise-ها به طور خلاصه

زمانی که یک Promise فراخوانی می‌شود در «حالت انتظار» (pending state) کار خود را آغاز می‌کند. این بدان معنی است که تابع فراخواننده به اجرای خود ادامه می‌دهد در حالی که منتظر Promise است تا پردازش‌های خودش را اجرا کند و بازخوردی به تابع فراخواننده بدهد.

در این زمان تابع فراخواننده منتظر آن می‌ماند تا Promise را در «حالت حل شده» (resolved state) یا در «حالت رد شده» (rejected state) بازگشت دهد، اما چنان که می‌دانید جاوا اسکریپت همگام است و از این رو در زمانی که Promise کار نمی‌کند، تابع همچنان به اجرای خود ادامه می‌دهد.

کدام API جاوا اسکریپت از Promise-ها استفاده می‌کند؟

علاوه بر کد کاربر و کد کتابخانه‌های مختلف، Promise-ها از سوی API-های مدرن استاندارد وب مانند لیست زیر نیز مورد استفاده قرار می‌گیرند:

  • Battery API
  • Fetch API
  • Service Workers

این که در جاوا اسکریپت مدرن از Promise-ها استفاده نکنید امر بسیار نامحتملی است، بنابراین در ادامه به بررسی دقیق‌تر آن‌ها می‌پردازیم.

ایجاد یک Promise

API مربوط به Promise یک سازنده Promise عرضه می‌کند که با استفاده از ()new Promise مقداردهی اولیه می‌شود:

چنان که می‌بینید Promise ثابت سراسری done را بررسی می‌کند و اگر درست باشد، یک Promise حل شده و در غیر این صورت Promise رد شده بازگشت می‌یابد. ما با استفاده از resolve و reject می‌توانیم یک مقدار را بازگشت دهیم. در حالت فوق ما صرفاً یک رشته بازگشت می‌دهیم اما می‌توان یک شیء را نیز بازگشت داد.

مصرف کردن یک Promise

در بخش قبلی، با روش ایجاد شدن یک Promise آشنا شدیم. اکنون به بررسی شیوه مصرف یا استفاده شدن یک Promise می‌پردازیم:

اجرای ()checkIfItsDone موجب اجرا شدن یک Promise به نام ()isItDoneYet می‌شود که منتظر حل شدن با استفاده از Callback-ی به نام then باقی می‌ماند و اگر خطایی رخ دهد آن را در callback با نام catch مدیریت می‌کند.

زنجیره‌سازی Promise-ها

هر Promise می‌تواند به Promise دیگری بازگشت یابد و یک زنجیره از Promise-ها تشکیل دهد. مثالی عالی از زنجیره‌سازی Promise-ها در API با نام Fetch مشاهده می‌شود که یک لایه فوقانی روی API مربوط به XMLHttpRequest است و می‌توان از آن برای ایجاد یک منبع و صف‌بندی یک زنجیره از Promise-ها برای اجرا در زمان واکشی شدن منبع استفاده کرد.

API با نام Fetch یک سازوکار مبتنی بر Promise است به طوری که فراخوانی ()fetch معادل تعریف کردن یک Promise با استفاده از ()new Promise است.

نمونه‌ای از زنجیره‌سازی Promise-ها

در این مثال، ()fetch را فراخوانی می‌کنیم تا فهرستی از آیتم‌های TODO را از فایل todos.json که در ریشه دامنه قرار دارد به دست آوریم و بنابراین یک زنجیره از Promise-ها ایجاد کرده‌ایم.

اجرای ()fetch موجب بازگشت یک response می‌شود که مشخصه‌های زیادی دارد، اما دو مورد از آن‌ها برای ما مهم هستند:

  • Status – یک مقدار عددی است که کد وضعیت HTTP را نشان می‌دهد.
  • statusText – یک پیام وضعیت است که در صورت موفق بودن درخواست، مقدار آن OK خواهد بود.

response یک متد ()json نیز دارد که یک Promise بازگشت می‌دهد و در آن به بررسی محتوای متنی پردازش شده و تبدیل آن به JSON می‌پردازد. با توجه به Promise-های فوق روند رویدادها به این صورت است که Promise اول در زنجیره، تابعی است که ما تعریف کرده‌ایم و آن را ()status می‌نامیم. این Promise وضعیت پاسخ را بررسی می‌کند و در صورتی که پاسخ موفق (کد بین 200 تا 299) نباشد، Promise را رد می‌کند.

این عملیات موجب می‌شود که زنجیره Promise همه Promise-های بعدی لیست شده را رد کند و مستقیماً به گزاره ()catch در انتهای کد برسد و متن Request failed را به همراه پیام خطا لاگ کند. اما اگر Promise اول موفق باشد، تابع ()json را که تعریف کرده‌ایم، فراخوانی می‌کند. از آنجا که Promise قبلی در صورت موفقیت، شیء response را بازگشت داده است، می‌توانیم آن را به عنوان ورودی به Promise دوم بدهیم.

در این حالت، داده‌های JSON پردازش شده را بازگشت می‌دهیم تا Promise سوم مستقیماً JSON را دریافت کند:

در نهایت آن را در کنسول لاگ می‌کنیم.

مدیریت خطاها

در مثال بخش قبلی، یک catch داشتیم که به زنجیره Promise-ها الصاق می‌شد. هر زمان که جزئی از زنجیره Promise-ها ناموفق باشد و خطایی رخ دهد یا یک Promise رد شود، کنترل به گزاره ()catch در انتهای زنجیره می‌رسد.

یا

آبشار سازی خطاها

اگر درون ()catch خطایی رخ دهد، می‌توان یک ()catch دیگر برای مدیریت آن الصاق کرد و این روند همین طور تا انتها ادامه می‌یابد:

هماهنگ‌سازی Promise-ها

در این بخش به روش هماهنگ کردن چند Promise می‌پردازیم.

()Promise.all

اگر لازم است که Promise-های مختلف را با یکدیگر هماهنگ کنید، می‌توانید از متد ()Promise.all برای تعریف کردن لیستی از Promise-ها استفاده کنید و زمانی که همه آن‌ها حل شدند، تابع دیگری را اجرا کنید.

مثالی از آن به صورت زیر است:

ساختار destructuring assignment در ES2015 نیز اجازه اجرای چنین کاری را می‌دهد:

البته شما محدود به استفاده از fetch نیستید و می‌توانید از هر Promise دیگری نیز استفاده کنید.

()Promise.race

این متد زمانی اجرا می‌شود که اولین Promise که به آن ارسال کرده‌اید حل شود و callback الصاق شده به آن را یک بار به همراه نتیجه نخستین Promise حل شده اجرا می‌کند. مثالی از آن به صورت زیر است:

یک خطای رایج

اگر با خطای زیر در کنسول مواجه شدید:

Uncaught TypeError: undefined is not a promise

ابتدا باید اطمینان حاصل کنید که به جای ()Promise از ()new Promise استفاده کرده‌اید.

Async و Await

جدیدترین رویکرد به تابع‌های ناهمگام در جاوا اسکریپت Async و Await است. جاوا اسکریپت در طی مدت بسیار کوتاهی (ES2015) استفاده از Callback را کنار گذاشت و به بهره‌گیری از Promise-ها روی آورد. از نسخه ES2017 نیز کدهای ناهمگام در جاوا اسکریپت با استفاده از ساختار async/await ساده‌تر شده‌اند.

تابع‌های async ترکیبی از Promise-ها و generatos-ها هستند و اساساً لایه بالاتری از تجرید نسبت به Promise محسوب می‌شوند. در اینجا باید یک بار دیگر تکرار کنیم که async/await بر مبنای Promise-ها ساخته شده‌اند.

Async/Await چرا معرفی شد؟

تابع‌های Async/Await باعث کاهش حجم کد مورد نیاز برای نوشتن Promise-ها می‌شوند و محدودیت «عدم قطع زنجیره» Promise-های زنجیره‌سازی را نیز مرتفع می‌سازند. زمانی که Promise-ها در نسخه ES2015 معرفی شدند، هدف از ارائه آن‌ها حل مشکلی در کدنویسی ناهمگام بود و در این کار نیز موفق بودند، اما در طی دو سال که بین عرضه نسخه‌های ES2015 و ES2017 وجود داشت مشخص شد که Promise-ها نمی‌توانند راه‌حل نهایی باشند.

Promise-ها برای حل مشکل مشهور جهنم callback-ها عرضه شدند، اما آن‌ها نیز پیچیدگی خاص خود را داشتند و از نظر کاربران دارای ساختار پیچیده‌ای بودند. Promise-ها با این کارکرد که به ما نشان دادند می‌توان از ساختار مناسب‌تری به این منظور استفاده کرد مفید بودند و لذا اینک زمانی فرا رسیده است که از تابع‌های async استفاده کنیم. تابع‌های async/await موجب می‌شوند کد همگام به نظر برسد، اما اساساً ناهمگام است و در پشت صحنه به روشی غیر مسدودکننده عمل می‌کند.

طرز کار Async/Await چگونه است؟

تابع async یک Promise بازگشت می‌دهد. به مثال زیر توجه کنید:

زمانی که بخواهیم این تابع را فراخوانی کنیم یک await آماده می‌کنیم و کد فراخوانی کننده متوقف می‌شود تا این که Promise حل یا رد شود. تنها الزام این است که تابع کلاینت باید به صورت async تعریف شود. به مثال زیر توجه کنید:

یک مثال ساده

در مثال ساده زیر از async/await برای اجرای ناهمگام یک تابع استفاده شده است:

کد فوق عبارت زیر را در کنسول مرورگر نمایش می‌دهد:

BeforeAfterI did something //after 3s

Promise کردن همه چیز

الصاق کردن کلیدواژه async به هر تابعی به این معنی است که تابع یک Promise بازگشت خواهد داد. حتی اگر این کار به طور صریح انجام نشده باشد، این کار موجب می‌شود که تابع به صورت درونی یک Promise بازگشت دهد. به همین دلیل است که کد زیر معتبر است:

این کد نیز مانند کد فوق است:

خواندن این کد کاملاً آسان‌تر است

چنان که در مثال فوق می‌بینیم، کد ما بسیار ساده به نظر می‌رسد. آن را با کدی که از Promise-های ساده استفاده می‌کرد و از زنجیره‌سازی و تابع‌های callback بهره می‌گرفت مقایسه کنید. این یک مثال بسیار ساده است، مزیت اصلی زمانی بروز می‌یابد که کد بسیار پیچیده‌تر باشد. برای نمونه با استفاده از Promise-ها به صورت زیر می‌توان یک منبع JSON را دریافت کرده و آن را تحلیل کرد:

کد زیر همان کارکرد فوق را با استفاده از await/async اجرا می‌کند:

سری کردن چند تابع Async

تابع‌های Async را می‌توان بسیار ساده به هم زنجیر کرد و ساختار آن نسبت به Promise-های ساده بسیار خواناتر است:

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

I did something and I watched and I watched as well

دیباگ آسان‌تر

دیباگ کردن Promise-ها دشوار است زیرا دیباگر روی کد ناهمگام نمی‌ایستد. اما async/await کار دیباگ را بسیار آسان‌تر ساخته‌اند، زیرا از نظر کامپایلر آن‌ها کد همگام هستند.

Event Emitter در Node.js

با استفاده از Event Emitter در Node.js می‌توان رویدادهای سفارشی ایجاد کرد. اگر با جاوا اسکریپت در مرورگر کار کرده باشید، می‌دانید که بخش عمده تعامل با کاربر از طریق رویدادهایی مانند کلیک‌های ماوس، فشردن کلیدهای کیبورد، واکنش به حرکت ماوس و غیره مدیریت می‌شود. در سمت بک‌اند، Node.js کلاس EventEmitter را ارائه کرده است که برای مدیریت رویدادها استفاده می‌شود. این کلاس را می‌توان با استفاده از کد زیر مقداردهی کرد:

این شیء متدهای on و emit برخی متدهای دیگر را عرضه می‌کند.

  • emit – برای تحریک کردن یک رویداد استفاده می‌شود.
  • on – برای افزودن تابع callback استفاده می‌شود که قرار است هنگام تحریک شدن رویداد اجرا شود.

برای نمونه، یک رویداد start ایجاد می‌کنیم و از آنجا که می‌خواهیم مثال ساده‌ای باشد، واکنش ما به آن لاگ کردن پیامی در کنسول است:

زمانی که رویداد را اجرا کنیم:

تابع دستگیره رویداد تحریک می‌شود و لاگ کنسول ایجاد می‌شود. با استفاده از آرگومان‌های اضافی ()emit می‌توان آرگومان‌هایی به دستگیره رویداد ارسال کرد:

آرگومان‌های چندگانه

شیء EventEmitter چند متد دیگر نیز برای تعامل با رویدادها در اختیار ما قرار می‌دهد که از آن جمله‌اند:

  • ()once – یک شنونده یک‌بارمصرف اضافه می‌کند.
  • ()removeListener() / off – یک شنونده رویداد را از رویداد حذف می‌کند.
  • ()removeAllListeners – همه شنونده‌ها را از یک رویداد حذف می‌کند.

بدین ترتیب به پایان بخش هفتم از راهنمای جامع Node.js می‌رسیم. در بخش بعدی این راهنما در مورد پروتکل HTTP و طرز کار با آن در محیط Node صحبت خواهیم کرد. برای مطالعه بخش بعدی به لینک زیر مراجعه کنید:

ا

منبع: فرادرس

برنامه محاسبه e به توان عدد x — راهنمای کاربردی

در این مطلب، برنامه محاسبه e به توان عدد x ارائه شده است. محاسبه مقدار تابع نمایی ex با استفاده از «سری تیلور» (Taylor Series)، به صورت زیر، امکان‌پذیر است.

e^x = 1 + x/1! + x^2/2! + x^3/3! + ......

پرسشی که اکنون مطرح می‌شود این است که چگونه می‌توان به صورت کارا، مجموع سری بالا را محاسبه کرد. سری را می‌توان به صورت زیر نوشت:

e^x = 1 + (x/1) (1 + (x/2) (1 + (x/3) (........) ) )

مجموعی که نیاز به محاسبه آن برای n عبارت وجود دارد را می‌توان با استفاده از حلقه‌ای که در زیر آمده، محاسبه کرد.

for (i = n - 1, sum = 1; i > 0; --i )
sum = 1 + x * sum / i;

در ادامه، پیاده‌سازی راهکار بالا در زبان‌های برنامه‌نویسی ++C/C، «جاوا» (Java)، «پایتون 3» (Python 3)، «سی‌شارپ» (#C) و«پی‌اچ‌پی» (PHP) انجام شده است. برای آشنایی بیشتر با عدد e، مطالعه مطلب «توابع نمایی و عدد e — به زبان ساده» و همچنین، برای آشنایی بیشتر با سری تیلور، مطالعه مطلب «سری تیلور — از صفر تا صد» توصیه می‌شود.

برنامه محاسبه e به توان عدد x در ++C/C

برنامه محاسبه e به توان عدد x در جاوا

برنامه محاسبه e به توان عدد x در پایتون 3

برنامه محاسبه e به توان عدد x در سی شارپ

برنامه محاسبه e به توان عدد x در PHP

خروجی

همانطور که مشهود است، در قطعه کدهای بالا (همه کدهای ارائه شده برای زبان‌های گوناگون شامل پایتون، جاوا، ++C و سی‌شارپ)، مقدار x برابر با 1 وارد شده است. در نتیجه، خروجی قطعه کدهای بالا به ازای x=1، برابر با مقدار ارائه شده در زیر است.

e^x = 2.718282

ا

منبع: فرادرس

روندهای مهم توسعه وب در سال 2۰1۹ — راهنمای جامع

آیا می‌دانید که هر دقیقه نزدیک به 200 وب‌سایت به دنیای اینترنت اضافه می‌شود؟ این عدد حیرت‌انگیز است، اما یک واقعیت محسوب می‌شود و به همین دلیل است که هر کارآفرین و توسعه‌دهنده‌ای باید در مورد روندهای مهم توسعه وب آگاهی داشته باشد.

در مجموع 200 میلیون وب‌سایت فعال در حال حاضر وجود دارد، اما مجموع وب‌سایت‌های فعال و غیرفعال، ده برابر این عدد است. وب‌سایت‌ها تأثیر بالایی روی بازار و کسب‌وکارها گذارده‌اند. در واقع کسب‌وکارها امروزه از وب‌سایت‌ها برای تثبیت حضور آنلاین خود به روشی قدرتمند بهره می‌گیرند.

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

فناوری به سرعت در حال تغییر است و هر روز شاهد پیشرفت هستیم. این به‌روزرسانی‌ها تأثیر بسیار مهمی در روش توسعه وب گذارده است. توسعه‌دهندگان باید همواره به دنبال روندهای جاری باشند و خودشان را به دانش روز مجهز کنند. در ادامه برخی از روندهای برتر توسعه وب‌سایت برای سال 2۰1۹ را مرور می‌کنیم.

وب‌ اپلیکیشن‌های پیش‌رونده

روندهای مهم توسعه وب

مطالعه‌ای که اخیراً اجرا شده نشان می‌دهد افراد، 85 درصد از زمان خود را صرف اپلیکیشن‌های موبایل می‌کنند. «وب‌اپلیکیشن‌های پیش‌رونده» (Progressive Web Apps)، به صفحه‌های وبی گفته می‌شود که در دید کاربران مانند اپلیکیشن به نظر می‌رسند. اگر این صفحه‌ها از پیش روی گوشی کاربر بارگذاری شده باشند، حتی می‌تواند بدون دسترسی به اینترنت نیز آن‌ها را باز کند. کاربران در زمان استفاده از این وب‌اپلیکیشن‌ها بیشتر حس استفاده از اپلیکیشن را خواهند داشت تا مراجعه به یک وب‌سایت. هدف این وب‌اپلیکیشن‌های پیش‌رونده (PWA) این است که تجربیاتی «شبه بومی» (native-like) برای کاربران همه پلتفرم‌ها ارائه کند.

گوگل در یک گزارش بیان کرده است که 53 درصد از بازدیدکنندگان سایت روی موبایل در صورتی که صفحه‌ای در طی 3 ثانیه بارگذاری نشود آن را ترک می‌کنند. وب‌اپلیکیشن‌های پیش‌رونده این مشکل را به طور کامل حل کرده‌اند. این وب‌اپلیکیشن‌ها مزیت‌های اپلیکیشن‌های وب و نیتیو را در خود جمع کرده‌اند و حس خوبی به کاربران می‌دهند. کاربران در زمان استفاده از آن‌ها حس استفاده از یک اپلیکیشن را خواهند داشت که نیازی به نصب هم ندارد.

PWA تجربه تمام صفحه به کاربران می‌دهد و URL وب‌سایت قابل مشاهده نیست. بدین ترتیب هویت برند به روشی قدرتمندتر نمایش پیدا می‌کند. PWA-ها برای شبیه‌سازی اپلیکیشن‌های نیتیو، امکان پوش نوتیفیکیشن را نیز در اختیار کاربران گذاشته‌اند. ناشر دسترسی کاملی روی این پوش نوتیفیکیشن‌ها خواهد داشت و می‌تواند در موارد مقتضی آن‌ها را مستقیماً به گوشی کاربر ارسال کند.

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

کاربران می‌توانند همه این کارها را بدون نیاز به اتصال اینترنتی و از طریق PWA-ها اجرا کنند. این‌ها برخی از دلایل مهمی است که چرا باید به PWA-ها اهمیت بدهیم. همه محتوایی که روی PWA منتشر می‌کنید، حتی زمانی که کاربران اتصال اینترنت ندارند نیز در اختیار آن‌ها خواهد بود.

چت‌ بات‌ها

روندهای مهم توسعه وب

محبوبیت چت‌بات‌ها، این روزها بسیار افزایش یافته است. این برنامه‌ها برای تعامل با انسان طراحی شده‌اند. برخی چت‌بات‌ها طوری طراحی شده‌اند که به سؤالات ساده پاسخ دهند و برخی دیگر می‌توانند به سؤالات پیچیده نیز به سهولت پاسخ دهند.

چت‌بات‌ها یکی از محبوب‌ترین روندهای توسعه وب محسوب می‌شوند. یکپارچه‌سازی آن‌ها در وب‌سایت‌ها به تولید ترافیک بیشتر و خوشایندتر ساختن سایت کمک زیادی می‌کند. چت‌بات‌ها تأثیر بسیار بیشتر از آن چه بتوان تصور کرد می‌گذارند. کاربران این روزها به دنبال راه‌حل‌های سریع هستند و هیچ تمایلی به صرف زمان خود برای بارگذاری یا هر مشکل دیگر از این دست ندارند. یک تأخیر کوچک در پاسخ دادن به سؤال می‌تواند منجر به ترک وب‌سایت شود.

بهترین کاری که می‌توان در این وضعیت انجام داد، ادغام یک چت‌بات در وب‌سایت است. این چت‌بات‌ها به سؤالاتی که مشتری‌ها دارند پاسخ می‌دهند. بدین ترتیب دیگر نیازی به آزمودن میزان صبر مشتریان وجود ندارد.

فشاری که در بحث تجربه کاربری روی توسعه‌دهنده‌های وب وجود دارد بسیار بالا است. این افراد همواره در تقلا برای ارائه تجربه تماس بهتر کاربران با وب‌سایت هستند و می‌خواهند تجربه مثبت‌تری در آن‌ها ایجاد کنند.

چت‌بات‌ها در این مسیر کمک زیادی به توسعه‌دهندگان می‌کنند. انتظارات مشتریان بالا است و گرچه نمی‌توان هر آن چه را که می‌خواهند در اختیار آن‌ها قرار داد، اما این چت‌بات‌ها می‌توانند منبع مورد اطمینانی در این زمینه باشند. چت‌بات‌ها کاربر را مطمئن می‌سازند و به طور همزمان به سؤالات آن‌ها نیز پاسخ می‌دهند. چت‌بات‌ها نهایت آرزوی توسعه‌دهنده‌های وب هستند.

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

فریمورک‌های جاوا اسکریپت

روندهای مهم توسعه وب

فریمورک‌ها چیزی هستند که توجه بسیاری از توسعه‌دهندگان را در سراسر دنیا به خود جلب کرده‌اند. اما فریمورک چیست؟ در واقع فریمورک چیز به جز یک پلتفرم طراحی نیست که از کدنویسی برای زبان‌های مختلف برنامه‌نویسی پشتیبانی می‌کند.

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

انواع مختلفی از فریمورک‌ها در بازار وجود دارند و انتخاب بهترین فریمورک کاملاً به نیازهای توسعه‌دهنده بستگی دارد.

برخی فریمورک‌های محبوب جاوا اسکریپت به شرح زیر هستند:

  • React.js
  • Angular.js
  • Vue.js
  • Ember.js
  • Backbone.js

با توجه به محبوبیت، ری‌اکت و انگولار فریمورک‌هایی هستند که بیشترین توجه توسعه‌دهندگان را جلب کرده‌اند، اما شما می‌توانید هر فریمورکی که نیازهای شما را پاسخ می‌دهد انتخاب کنید.

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

کاهش سرعت بارگذاری صفحه

روندهای مهم توسعه وب

این روزها تعداد افرادی که گوشی‌های هوشمند دارند بسیار افزایش یافته است. با توجه به افزایش کاربران تلفن موبایل، گوگل سرویسی به نام «صفحات پرشتاب موبایل» (Accelerated Mobile Pages) راه‌اندازی کرده است که امکان بارگذاری آنی صفحه‌های وب را فراهم ساخته است.

این صفحه‌ها طوری طراحی شده‌اند که روی دستگاه‌های موبایل عملکرد روانی داشته باشند. گوگل همواره بیان کرده است که به صفحه‌های وبی نیاز داریم که دارای محتوای غنی از قبیل ویدئو، انیمیشن و گرافیک باشند و بدین ترتیب می‌توانند همراه با تبلیغات هوشمند کار کنند. این محتوا باید در حد امکان در سریع‌ترین زمان بارگذاری شود.

افراد زمان زیادی برای منتظر ماندن جهت بارگذاری یک صفحه وب ندارند. در واقع کاربران صفحه وبی را که سریع بارگذاری نمی‌شود رها می‌کنند و وب‌سایت دیگری را باز می‌کند. برای جلوگیری از وقوع چنین موقعیت‌هایی لازم است که توسعه‌دهندگان از سرویس صفحه‌های پرشتاب موبایل استفاده کنند.

این فرصتی عالی برای توسعه‌دهندگان وب است تا سرعت بارگذاری موبایل وب‌سایت را بهبود ببخشند و ترافیک بیشتری به دست آورند.

اپلیکیشن‌های تک‌ صفحه‌ای

روندهای مهم توسعه وب

ما در دنیای پرشتابی زندگی می‌کنیم و هیچ کس عملاً زمان کافی برای سر زدن به صفحه‌های مختلف یک وب‌سایت ندارد. اپلیکیشن‌های تک‌صفحه‌ای چیزی به جز یک وب‌سایت با صفحه منفرد نیستند که همه چیز صرفاً در همان یک صفحه ارائه می‌شود.

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

توسعه با کد کمتر

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

اگر به تازگی یک وب‌سایت را آغاز کرده‌اید، در این صورت این بهترین روش برای تحرک بخشی به روند طراحی است. می‌توانید کار خود را با «توسعه با کد کمتر» آغاز کنید و سپس کم کم مهارت بیشتری پیدا کنید.

امنیت سایبری

روندهای مهم توسعه وب

نشت داده یکی از بزرگ‌ترین موانع است که هر شرکتی می‌تواند با آن مواجه شود. هک شدن وب‌سایت‌ها واقعه‌ای است که اخبار آن را مکرر می‌شنویم. حفاظت از وب‌سایت در برابر هرگونه حمله، بسیار مهم است و به همین دلیل است که امنیت سایبری امروزه به یکی از بزرگ‌ترین موضوعات رایج تبدیل شده است.

توسعه‌دهندگان تلاش می‌کند که وب‌سایتشان را در برابر حمله‌های سایبری نفوذناپذیر بسازند. آن‌ها تکنیک‌های مختلفی برای ایمن نگه‌داشتن توسعه وب در برابر هرگونه تهدید اجرا می‌کنند.

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

بهینه‌سازی جستجوی صوتی

روندهای مهم توسعه وب

از سال 2008 تا به اکنون، کوئری‌های جستجوی صوتی 35 برابر افزایش یافته‌اند. بر اساس یک پیمایش که از سوی Hubspot اجرا شده، 19 درصد از افراد روزانه دست‌کم یک بار از Siri استفاده می‌کنند و تعداد نوجوان‌هایی که از جستجوی صوتی استفاده می‌کنند بسیار بالاتر است. وب‌سایت شما باید به روشی طراحی شده باشد که امکان جستجوی صوتی به صورت بهینه در آن وجود داشته باشد.

جستجوی صوتی در موتورهای جستجوی مختلف ممکن است. Siri ،Cortana ،Google Assistant ،Echo و Alexa این جستجوهای صوتی را افزایش می‌دهند. به مرور افراد بیشتری علاقه‌مند به شروع جستجوهای صوتی هستند و وب‌سایت‌هایی که امکان جستجوی صوتی بهینه‌ای ارائه می‌کنند، در زمانی که افراد جستجوی صوتی می‌کنند در رتبه‌های بالاتری نمایش پیدا می‌کنند.

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

سخن پایانی

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

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

منبع: فرادرس

یکپارچه سازی صفحه ورود گوگل (Google Login) با وبسایت PHP – از صفر تا صد

در این مقاله قصد داریم به توضیح شیوه یکپارچه‌سازی صفحه ورود گوگل در وب‌سایت PHP بپردازیم. ما از API به نام OAuth گوگل استفاده می‌کنیم که روشی آسان و قدرتمند برای ورود به یک وب‌سایت با حساب گوگل محسوب می‌شود.

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

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

ما در این مقاله از API ورود OAuth گوگل استفاده می‌کنیم تا کاربران وب‌سایتمان بتوانند با استفاده از اطلاعات حساب گوگل خود وارد وب‌سایت ما شوند. البته کاربران همچنان می‌توانند با استفاده از فرم ثبت نام معمولی وب‌سایت ثبت نام کنند، اما ارائه سرویس ورود گوگل یا چیزی مانند آن می‌تواند به حفظ نرخ «نگهداشت کاربر» (user retention) کمک کند.

طرز کار ورود گوگل چگونه است؟

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

زمانی که کاربر روی دکمه Login With Google کلیک کند، یک گردش کار ورود گوگل آغاز می‌شود که کاربر را به سایت گوگل می‌برد تا وارد حساب خود شود. هنگامی که کاربر به صفحه مربوطه منتقل شود، اطلاعات حساب گوگل خود را وارد می‌کند و سپس به صفحه «کسب رضایت» (consent) هدایت خواهد شد. در صفحه کسب رضایت از کاربر سؤال می‌شود که آیا اجازه اشتراک اطلاعات حساب گوگل خود با وب‌سایت شخص ثالث را می‌دهد. در این حالت وب‌سایت شخص ثالث همان سایتی است که کاربر می‌خواهد با اطلاعات حساب گوگل خود در آن وارد شود. کاربر در این مرحله دو گزینه دارد: یا موافقت و یا مخالفت می‌کند.

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

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

راه‌اندازی پروژه برای ورود گوگل

در این بخش با مراحل تنظیم ابتدایی که برای یکپارچه‌سازی ورود گوگل در یک وب‌سایت PHP مورد نیاز است آشنا خواهیم شد.

ایجاد یک پروژه API گوگل

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

زمانی که وارد حساب گوگل خود شدید، به صفحه «کنسول توسعه‌دهندگان گوگل» (Google Developers Console) (+) بروید. بدین ترتیب صفحه داشبورد گوگل چنان که در تصویر زیر ملاحظه می‌کنید، باز می‌شود:

صفحه ورود گوگل

در منوی سمت چپ روی لینک Select a project کلیک کنید. بدین ترتیب پنجره‌ای که در تصویر زیر مشاهده می‌کنید، باز می‌شود:

صفحه ورود گوگل

روی لینک New Project کلیک کنید و نام پروژه و جزییات دیگر را در آن وارد کنید. جزییات ضروری را مطابق تصویر زیر وارد کنید:

صفحه ورود گوگل

روی دکمه Create کلیک کنید تا پروژه جدید ذخیره شود. بدین ترتیب به صفحه Dashboard هدایت می‌شوید. در آنجا در نوار کناری سمت چپ روی Credentials کلیک کنید و به برگه OAuth consent screen بروید:

صفحه ورود گوگل

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

سپس روی Credentials در نوار سمت چپ کلیک کنید. این کار موجب می‌شود که کادر API Credentials زیر برگه Credentials مانند تصویر زیر نمایان شود:

صفحه ورود گوگل

روی Client credentials > OAuth client ID کلیک کنید تا یک مجموعه جدید از اطلاعات ورود برای اپلیکیشن ایجاد شود. بدین ترتیب صفحه‌ای ظاهر می‌شود که در آن باید گزینه مناسب را انتخاب کنید. در این مورد گزینه Web application را انتخاب می‌کنیم و روی دکمه Create کلیک می‌کنیم. از شما خواسته می‌شود که چند اطلاعات دیگر را نیز در مورد اپلیکیشن خود وارد کنید.

صفحه ورود گوگل

جزییاتی که در تصویر فوق می‌بینید را وارد کنید و آن را ذخیره کنید. البته شما باید Redirect URI را نیز در تنظیمات اپلیکیشن تنظیم کنید. این همان آدرسی است که کاربر پس از وارد شدن به آن باز هدایت خواهد شد.

در این زمان، یک اپلیکیشن کلاینت OAuth2 گوگل ایجاد کرده‌ایم و اینک می‌توانیم از این اپلیکیشن برای یکپارچه‌سازی ورود گوگل در وب‌سایت خود استفاده کنیم. توجه داشته باشید که مقادیر Client ID و Client Secret در زمان پیکربندی اپلیکیشن در سمت وب‌سایت مورد نیاز خواهند بود. شما می‌توانید هر زمان با مراجعه به اپلیکیشن خود در وب‌سایت «کنسول توسعه‌دهندگان گوگل» به این اطلاعات دسترسی داشته باشید.

نصب کتابخانه کلاینت SDK گوگل مربوط به PHP

در این بخش باید کتابخانه کلاینت SDK گوگل مربوط به PHP را نصب کنیم. دو روش به این منظور وجود دارد:

  1. استفاده از Composer
  2. دانلود و نصب دستی فایل‌های کتابخانه

روش Composer

اگر ترجیح می‌دهید کتابخانه مزبور را از طریق Composer نصب کنید، کافی است دستور زیر را اجرا کنید:

composer require google/apiclient:"^2.0"

به همین راحتی کتابخانه SDK گوگل نصب می‌شود.

دانلود فایل‌ها

اگر می‌خواهید از کامپوزر استفاده نکنید، می‌توانید آخرین نسخه پایدار کتابخانه مربوطه را از صفحه رسمی API (+) دانلود کنید. ما در این مقاله از روش کامپوزر استفاده کردیم.

اگر گام به گام با ما همراه بوده‌اید، اکنون موفق شده‌اید اپلیکیشن گوگل را پیکربندی کرده و کتابخانه API کلاینت PHP گوگل را نصب کنید. در بخش بعدی شیوه استفاده از این کتابخانه در وب‌سایت PHP را بررسی می‌کنیم.

یکپارچه‌سازی کتابخانه PHP

اگر به خاطر داشته باشید، وقتی در بخش قبلی مشغول پیکربندی اپلیکیشن گوگل بودیم، از ما درخواست شد که redirect URL را در پیکربندی اپلیکیشن وارد کنیم و ما آن را طوری تنظیم کردیم که به آدرس http://localhost/redirect.php باز هدایت شود. اینک زمان آن رسیده است که فایل را بسازیم.

بدین ترتیب فایل را با محتوای زیر ایجاد کنید:

در ادامه بخش‌های کلیدی کد فوق را بررسی می‌کنیم.

نخستین کاری که باید در فایل انجام دهیم، گنجاندن فایل autoload.php است. این بخشی از کامپوزر است و ما را مطمئن می‌سازد که کلاس‌هایی که در اسکریپت خود استفاده می‌کنیم به صورت خودکار بارگذاری می‌شوند.

require_once 'vendor/autoload.php';

سپس یک بخش پیکربندی وجود دارد که در آن پیکربندی اپلیکیشن با تنظیم موارد مقتضی مقداردهی می‌شود. البته توجه داشته باشید که شما باید جاهای خالی را با مقادیر مربوط به خود پر کنید.

در بخش بعدی شیء Google_Client مقداردهی می‌شود که از آن برای اجرای کارهای مختلفی استفاده می‌شود. همراه با این کار تنظیمات اپلیکیشن را نیز مقداردهی می‌کنیم.

سپس دامنه‌های ایمیل و پروفایل را نیز اضافه می‌کنیم تا کاربر پس از ورود به اطلاعات ابتدایی پروفایل خود دسترسی داشته باشد.

در نهایت یک بخش از کد داریم که گردش کار ورود را اجرا می‌کند.

ابتدا بخش else را بررسی می‌کنیم. این بخش زمانی تحریک می‌شود که مستقیماً به اسکریپت دسترسی داشته باشید. این بخش یک لینک را نمایش می‌دهد که کاربر را به صفحه ورود گوگل هدایت می‌کند. لازم به ذکر است که ما از متد createAuthUrl در شیء برای ساختن URL مربوط به OAuth استفاده کرده‌ایم.

پس از کلیک کردن روی لینک ورود گوگل، کاربر به وب‌سایت گوگل هدایت می‌شود تا اطلاعات مربوطه را وارد کند. زمانی که کاربر وارد حساب خود در گوگل شد، با ارسال متغیر رشته کوئری code دوباره به وب‌سایت بازمی‌گردد. این همان زمانی است که کد PHP در بلوک if اجرا می‌شود. ما از این کد برای مبادله توکن دسترسی استفاده می‌کنیم.

زمانی که توکن دسترسی را به دست بیاوریم، می‌توانیم از سرویس Google_Service_Oauth2 برای واکشی اطلاعات پروفایل کاربر وارد شده استفاده کنیم.

بدین ترتیب در این روش به اطلاعات پروفایل کاربری که از طریق حساب گوگل وارد شده دسترسی خواهیم داشت. می‌توان از این اطلاعات برای ایجاد حساب در سایت استفاده کرد و یا این که آن‌ها را در یک «نشست» (Session) ذخیره کرد. اساساً این به شما بستگی دارد که از اطلاعات برگشتی از گوگل چگونه استفاده کنید.

سخن پایانی

در این مقاله، به بررسی شیوه یکپارچه‌سازی ورود گوگل با وب‌سایت PHP پرداختیم. این کار به کاربران امکان می‌دهد در صورتی که نمی‌خواهند حساب دیگری روی سرویس شما ایجاد نکنند، با حساب‌های موجود گوگل خود وارد وب‌سایت شما بشوند.


منبع: فرادرس

برنامه نویسی در متلب (MATLAB) — راهنمای گام به گام

متلب (MATLAB) یک محیط محاسباتی و زبان برنامه‌نویسی است که کاربردهای فراوانی در رشته‌های مختلف علوم و مهندسی دارد. واژه MATLAB از دو واژه انگلیسی MATRIX به معنای ماتریس و LABORATORY به معنای آزمایشگاه تشکیل شده است، زیرا در آن مبنای محاسبات ماتریس‌ها هستند. در این آموزش با برنامه نویسی متلب آشنا خواهیم شد.

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

در این آموزش، برنامه‌نویسی متلب را به صورت گام به گام بیان می‌کنیم؛ بدین ترتیب که ابزارها و دستورات اساسی برنامه‌نویسی در متلب را در قالب ساده‌ترین مثال‌ها ارائه خواهیم کرد. همان‌طور که گفتیم، این آموزشِ گام به گام مبتنی بر مثال است و برای یادگیری باید هر یک از برنامه‌ها را در متلب نوشته و آن را اجرا کنید. محتوای این آموزش در هفت بخش ارائه می‌شود.

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

توجه کنید که در ادامه، وقتی می‌گوییم برنامه‌ای را بنویسید و یا اجرا نمایید، می‌توانید یکی از این دو کار را انجام دهید:

  • اگر قصد ذخیره برنامه‌ها را ندارید، می‌توانید کدها را در قسمت Command Window بنویسید و بعد از نوشتن هر خط از برنامه کلید Enter صفحه کلید را فشار دهید. بدین ترتیب، بعد از نوشتن آخرین خط و فشردن Enter برنامه اجرا می‌شود.
  • اگر می‌خواهید برنامه‌ها را برای استفاده‌های بعدی ذخیره کنید، روی New و پس از آن Script کلیک کنید تا Editor باز شود. می‌توانید برنامه را در این Editor بنویسید و آن را نام‌گذاری (به صورت پیش‌فرض Untitled است) و ذخیره کنید. برای اجرای برنامه باید روی Run کلیک کنید. در این صورت نتیجه اجرای برنامه در Command Window نشان داده خواهد شد.

برنامه نویسی در متلب

نکته دیگری که دانستن آن به شما کمک خواهد کرد این است که متلب توابع از پیش تعریف شده زیادی دارد. اگر با عملکرد تابعی آشنایی ندارید، کافی است در Command Window از یکی از دو دستور “help” یا “doc” استفاده کنید. بدین صورت که کلمه help یا doc را نوشته و بعد از یک فاصله نام تابع مورد نظرتان را بنویسید و کلید Enter را فشار دهید. با اجرای این دستورات، تفاوت help و doc را خواهید دید.

بخش اول: شروع برنامه نویسی متلب

این بخش شامل چند برنامه ساده برای آشنایی با برنامه‌نویسی در متلب است.

1. نوشتن اولین برنامه

برنامه زیر را بنویسید و آن را اجرا کنید.

خروجی این برنامه ۸ خواهد بود.

توجه کنید که نقطه ویرگول (;) در انتهای هر دستور برای جلوگیری از نمایش بصری خروجی به کار می‌رود. به عبارت دیگر، با گذاشتن نقطه ویرگول در انتهای هر دستور، آن خط از برنامه اصطلاحاً در حالت سکوت قرار می‌گیرد و در خروجی نمایش داده نمی‌شود. البته عملیات مورد نظر به صورت کامل انجام می‌شود. برای کد بالا به سادگی می‌توانید نقطه ویرگول بگذارید و نتیجه را ببینید.

2. مفهوم a = b چیست؟

در متلب و هر زبان برنامه‌نویسی دیگر، عبارت «a = b» به معنای «a مساوی با b است» نیست. در واقع، این عبارت محتوای b را در a قرار می‌دهد. برای تحقیق این مورد، برنامه زیر را بنویسید و نتیجه را ببینید.

احتمالاً همان‌طور که دیده‌اید، نتیجه 3 خواهد بود.

در واقع باید «متغیرهای» a و b را به عنوان دو ظرف در نظر بگیرید که برچسب‌های a و b دارند. در خط اول برنامه، عدد 3 را در ظرف aقرار داده‌ایم و در خط بعدی محتوای ظرف a (همان 3) را در طرف b ریخته‌ایم. توجه کنید که در این صورت، محتوای a تغییری نمی‌کند. خط سوم نیز محتوای b را نمایش می‌دهد.

3. عمل‌گرهای اصلی ریاضی

برنامه زیر را اجرا کنید.

می‌بینیم که خروجی ۵3 است. سمت راست خط سوم برنامه شامل چهار عمل‌گر اصلی ریاضی + (جمع)، – (تفریق)، * (ضرب) و / (تقسیم) است. همچنین نماد ^ به معنی «به توانِ» است؛ بنابراین، عبارت “b^2” یعنی b به توانِ 2.

4. مفهوم a=b (ادامه)

برنامه زیر را بنویسید و اجرا کنید.

خروجی این برنامه 4 است. در خط اول، عدد 3 به متغیر a تخصیص داده می‌شود. در خط دوم، ابتدا سمت راست (4=1+3) محاسبه شده و بعد از آن به متغیر a تخصیص داده می‌شود. یعنی عدد 4 جایگزین 3 می‌شود.

5. خروجی قالب بندی شده (Formatted Output)

برنامه زیر را بنویسید و اجرا کنید.

خروجی این کد به صورت زیر خواهد بود:

Hello

۶. خروجی قالب بندی شده

برنامه زیر را بنویسید و اجرا کنید.

خروجی این کد به صورت زیر خواهد بود:


دستور “fprintf” برای خروجی فرمت شده است. این خروجی در رشته اول درون این دستور در ‘…’ نوشته شده است. عبارت “4u%” (عدد صحیح 4 رقمی) و “6.4f%” (عدد حقیقی که تا 4 رقم اعداد نشان داده می‌شود) فرمت متغیرهای خروجی را نشان می‌دهند. دستور “sqrt” در خط چهارم برنامه تابعی است که از متغیر جذر می‌گیرد.

۷. آرایه‌ها

برنامه‌ زیر را در متلب بنویسید و آن را اجرا کنید.

خروجی این برنامه به صورت زیر است:

4 15 11

هر دو متغیر a و b آرایه‌هایی با سه عنصر یا درایه هستند. در خط سوم،‌ عمل “a+b” درایه‌ها یا عناصر متناظر را با یکدیگر جمع می‌کند.

۸. استخراج یک عنصر از آرایه

برنامه زیر را اجرا کنید.

خروجی این برنامه c = 11 است.

اگر b یک آرایه یک بعدی باشد، (b(n درایه nاُم این آرایه خواهد بود. از آن‌جایی (a(2 برابر با ۶ و (b(4 برابر با ۵ است، نتیجه خط سوم برنامه c=6+5 =11 خواهد بود.

9. یادداشت (Comment)

برنامه زیر را بنویسید و اجرا کنید.

خروجی این برنامه c=12 است. همان‌طور که می‌بینیم، بخش‌هایی از برنامه که قبل از آن‌ها علامت % قرار می‌گیرد، تأثیری در اجرای برنامه ندارد و برای نوشتن یادداشت‌ها و نکات مربوط به کد از آن استفاده می‌شود.

1۰. ادامه کد در خط بعد

برنامه زیر را اجرا و نتیجه را بررسی کنید.

گاهی یک خط یک برنامه طولانی می‌شود و لازم است برای جلوگیری از بی‌نظمی و درهم‌ریختگی کد، بخشی از آن را به خط بعد منتقل کنیم. برای این کار از سه نقطه “…” بین دو بخش استفاده می‌کنیم. در حقیقت، کد بالا با کد زیر یکسان است:

11. پاک کردن یک متغیر

برنامه زیر را بنویسید و آن را اجرا کنید.

با اجرای این برنامه با پیغام زیر مواجه خواهید شد:

.’Undefined function or variable ‘c1

این خطا به این دلیل است که متغیر “c1” دیگر وجود ندارد. شما با دستور “clear” این متغیر از حافظه کامپیوترتان حذف کره‌اید. توجه کنید که دستور “clear” فقط محتویات متغیر را حذف نمی‌کند، بلکه خود متغیر را کاملاً حذف می‌کند. گاهی پیش می‌آید که برنامه‌ای می‌نویسید و در آن متغیری دارید که اندازه آن بزرگ است و حافظه را اشغال می‌کند. با استفاده از دستور “clear” می‌توانید آن را حذف کنید. اگر دستور “clear” را بنویسید و بعد از آن نام چند متغیر را (با یک فاصله از هم) بنویسید، همه آن متغیرها حذف خواهند شد. برنامه‌ای بنویسید و این مورد را بررسی کنید.

12. توابع و ثوابت ریاضی

به سادگی می‌توان توابع و ثوابت معروف ریاضی را در متلب نوشت. برای مثال، برنامه زیر را بنویسید.

خروجی اجرای این برنامه y=1 و z=0.3679 است. همان‌طور که می‌بینید، می‌توانیم تابعِ تابع و بیشتر از آن را نیز بنویسیم. ابتدا داخلی‌ترین تابع محاسبه می‌شود و به سمت خارجی‌ترین تابع ادامه پیدا می‌کند. این مورد را برای برنامه بالا بررسی کنید.

 13. نامگذاری یک متغیر

متغیرهای متلب نسبت بین حروف بزرگ و کوچک تمایز قائل می‌شوند. برای مثال “FARADARS” و “faradars” دو متغیر متفاوت هستند. در نامگذاری متغیر می‌توان از زیرین خط یا آندرلاین (_) و یا اعداد نیز به عنوان بخشی از نام نیز استفاده کرد. برای مثال، “FDS_125” یک نام متغیر قابل قبول است. برخی نام‌ها مربوط به ثوابت خاصی هستند که در متلب تعریف شده‌اند و مقدار ثابتی دارند. مثلاً “pi” برابر با …3.14159 است.

14. رسم سریع یک نمودار

برنامه زیر را بنویسید و نتیجه اجرای آن را ببینید.

خروجی این برنامه شکل زیر است:

نمودار متلب

خط اول برنامه معادل با بردار [x=[0 0.1 0.2 0.3 … 19.8 19.9 20 است. به این ترتیب، این آرایه 101 عنصر دارد. به عبارت دیگر، “0:0.1:20” به این معنی است که این آرایه از عدد ۰ شروع شده و در هر گام به اندازه مجموع عدد قبلی و 0.1 یک عدد تولید می‌کند تا به انتهای بازه، یعنی 2۰، برسد. خط دوم برنامه آرایه y را برحسب x محاسبه می‌کند:

[((y = [sin(x(1)) sin(x(2)) sin(x(3)) … sin(x(200)) sin(x(201

یا

[(y = [sin(0) sin(0.1) sin(0.2) … sin(19.9) sin(20

خط سوم نیز y را برحسب x رسم می‌کند.

بخش دوم: حلقه‌ها

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

1۵. حلقه با for

برنامه زیر را بنویسید و نتیجه را ببینید.

نتیجه به صورت زیر خواهد بود:

3
3
3
3
3

سه خط آخر برنامه بالا یک «حلقه for» را تشکیل می‌دهند. عبارت اصلی بین دو بخش “for k=1:5” و “end” قرار گرفته و وقتی متغیر k با گام 1 از 1 تا ۵ تغییر می‌کند، عدد مورد نظر ۵ بار تکرار می‌شود.

1۶. حلقه for (استفاده از اندیس در محاسبات)

برنامه زیر را بنویسید و اجرا کنید.

خروجی این برنامه به صورت زیر است:

3
9
27
81
243

این خروجی‌ها به صورت 1^3، 2^3، 3^3، 4^3 و ۵^3 محاسبه شده‌اند. همان‌طور که می‌بینیم، در هر تکرار، مقدار k تغییر می‌کند و مقدار متناظر با هر تکرار برای محاسبه به کار می‌رود.

1۷. حلقه for (تأثیر بیش از یک متغیر در عبارت)

برنامه زیر را اجرا کنید.

خروجی این برنامه 45 است. در واقع، این عدد به صورت 9+8+7+6+5+4+3+2+1 محاسبه شده است. سعی کنید این برنامه را با توجه به مواردی که در بالا یاد گرفته‌اید تحلیل کنید.

1۸. حلقه for (تأثیر بیش از یک متغیر در عبارت)

برنامه زیر را بنویسید و اجرا کنید.

خروجی این برنامه 2۵ است که از مجموع 9+7+5+3+1 به دست آمده است. دستور “for k = 1:2:9” به این معنی است که فقط ۵ بار در حلقه حرکت می‌کنیم. ابتدا 1=k است. در تکرار بعدی 2+1=k خواهد بود و به همین ترتیب ادامه می‌یابد تا به ۹ برسد.

1۹. کار با آرایه در حلقه

برنامه زیر را بنویسید.

خروجی این کد 24 است که به صورت زیر محاسبه شده است:

sum1 = b(1)+b(2)+b(3)+b(4) = 3+8+9+4 = 24

2۰. کار با آرایه در حلقه

برنامه زیر را اجرا کنید.

خروجی این برنامه عدد 1۹ است و به صورت زیر محاسبه شده است:

sum1 = b(1)+b(3)+b(5) = 3+9+7 = 19

21. حلقه دوگانه

برنامه زیر را اجرا کنید و با توجه به نکاتی که آموخته‌اید سعی کنید آن را تحلیل کنید.

خروجی این برنامه 1۸ است و به صورت زیر محاسبه می‌شود:

Sum1 = 1*1+1*2+1*3 +2*1+2*2+2*3 = 18

22. حلقه دوگانه

برنامه زیر را بنویسید و اجرا کنید.

خروجی این برنامه به صورت زیر است:

n = 1    m = 1
n = 1    m = 2
n = 1    m = 3
n = 2   m = 1
n = 2   m = 2
n = 2   m = 3

23. استفاده پیچیده‌تر از حلقه و اندیس

برنامه زیر را بنویسید و آن را تحلیل کنید.

خروجی این برنامه 24 است و طبق رابطه زیر محاسبه می‌شود:

((sum1 = b(c(1))+b(c(2))+b(c(3))+b(c(4
(b(2)+b(3)+b(5)+b(7 =
5+7+9+3 =
24 =

بخش سوم: شاخه‌گزینی و شروط

در این بخش چگونگی تعریف شروط در برنامه را معرفی می‌کنیم.

24. دستور if

برنامه زیر را اجرا کنید.

خروجی این کد به صورت زیر نمایش داده می‌شود:

 

اگر در برنامه تغییر ایجاد کرده و عبارت “;num1=3” را جایگزین خط اول کنیم، خروجی به صورت زیر نمایش داده می‌شود:

همان‌طور که متوجه شده‌اید، در این برنامه، اگر num1 بزرگتر از ۵ باشد، عبارت “(fprintf(‘%4u is greater than 5 \r’, num1” اجرا می‌شود، و در غیر این صورت، کد “(fprintf(‘%4u is less than or equal to 5 \r’, num1” اجرا خواهد شد.

2۵. دستور if – elseif – else

برنامه زیر را بنویسید و آن را اجرا کرده و نتیجه را تحلیل کنید.

2۶. مثال محاسبه سال کبیسه

در اینجا با استفاده از برنامه‌نویسی متلب یک مثال کاربردی را حل می‌کنیم. می‌خواهیم برنامه‌ای بنویسیم که تعیین کند یک سال میلادی مشخص کبیسه است یا خیر. برنامه زیر را بررسی کنید. در تقویم میلادی نو سال‌هایی که بر 4 بخش‌پذیر باشند (باقی‌ماندهٔ تقسیم آن سال بر 4 برابر ۰ باشد) کبیسه هستند، با این استثنا که از میان سال‌هایی که بر 1۰۰ بخش‌پذیرند (سال‌های انتهای سده)، تنها آنهایی که بر 4۰۰ نیز بخش‌پذیرند کبیسه هستند.

خروجی برنامه بالا به صورت زیر است:

سعی کنید سال‌های مختلف را در برنامه وارد کرده و نتایج را بررسی کنید.

در خط چهارم برنامه، “&” به معنی «وَ» است. بنابراین، هر دو شرط “(mod(nyaer,4) == 0)” و “(mod(nyear,100) ~= 0)” باید صحیح باشند تا دستور “(fprintf(‘%6u is a leap year’, nyear” اجرا شود. به طور مشابه، خط عمودی “|” نیز به معنی «یا» است.

همچنین، نمادهای “=~” در خط چهارم به معنی «برابر نیست با» است. از این دست شروط،‌ شش مورد وجود دارد که در دستورات شرطی برای مقایسه دو عدد با هم مورد استفاده قرار می‌گیرند. این عبارت‌ها به شرح زیر هستند:

A>BA بزرگتر از B است.
A<BA کوچکتر از B است.
A>=BA بزرگتر یا مساوی B است.
A<=BA کوچکتر یا مساوی B است.
A==BA مساوی B است.
A~=BA با B برابر نیست.

تابع “(mod(A,B” باقیمانده تقسیم A بر B را نتیجه می‌دهد. برای مثال، mod(7,2) = 1 ،mod(10,4) = 2 و mod(25,5) = 0 است. بنابراین، اگر A بر B بخش‌پذیر باشد، mod(A,B) = 0 است. این تابع در بسیاری از کاربردهای مربوط به روش‌های عددی مفید است.

2۷. ترکیب حلقه و شرط

برنامه زیر را در متلب بنویسید.

اگر این برنامه را اجرا کنید، خروجی به صورت زیر خواهد بود:

sum1 = 45
sum2 = 18

با تحلیل این برنامه خواهید دید که خروجی‌ها به صورت زیر محاسبه شده‌اند:

Sum1 = 1+2+3+4+5+6+7+8+9

sum2 = 3+6+9

2۸. حلقه while

برنامه زیر را در متلب بنویسید و آن را اجرا کنید.

خروجی این برنامه x = 243 است. اگر به مفهوم while دقت کنیم، می‌بینیم که ترکیبی از یک حلقه for و یک if است. در برنامه بالا، تا زمانی که شرط داخل پرانتز (x<100) برقرار باشد، محاسبه در حلقه انجام خواهد شد. بنابراین، مقادیر 3، ۹، 2۷، ۸1 و در نهایت 243 برای x محاسبه می‌شود و چون 243 بزرگتر از 1۰۰ است و دیگر شرط برقرار نیست، محاسبات ادامه پیدا نمی‌کند.

بخش چهارم: آرایه و ماتریس

در این بخش، با نحوه کار کردن با ماتریس‌ها و آرایه‌ها آشنا می‌شویم.

 2۹. جمع دو آرایه

برنامه زیر، جمع دو آرایه را نشان می‌دهد.

خروجی این برنامه به صورت زیر است:

c = 5 19 29

3۰. جمع دو ماتریس

دو ماتریس را به صورت زیر جمع کنید و نتیجه را ببینید.

خروجی کد بالا به صورت زیر است:

c = 8 6
12 13

این برنامه، در حقیقت، عملیات زیر را انجام می‌دهد:

31. ضرب یک عدد در آرایه یا ماتریس

برنامه زیر را بنویسید و خروجی آن را بررسی کنید.

خروجی این برنامه به صورت زیر است:

b = 6 10
2 8

32. ضرب درایه به درایه دو آرایه یا دو ماتریس با ابعاد مشابه

برنامه زیر را بنویسید و آن را اجرا کنید.

خروجی این برنامه به صورت زیر است:

c = 4 12 45

نقطه (.) قبل از عملگر ریاضی “*” عملیات را به صورت درایه به درایه انجام می‌دهد. در این حالت، c به صورت زیر محاسبه خواهد شد:

[(c = [a(1)*b(1) a(2)*b(2) a(3)*b(3

33. ضرب درایه به درایه دو ماتریس

برنامه زیر را در متلب اجرا کنید:

همان‌طور که انتظار دارید، خروجی این برنامه برابر است با:

c = 10 3
7 8

34. ضرب مستقیم دو ماتریس (نه درایه به درایه)

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

خروجی برنامه به صورت زیر است:

c = 31 8
33 9

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

3۵. توابع پایه با یک متغیر برداری

برنامه زیر را اجرا کنید.

خروجی این برنامه به صورت زیر است:

b = 0.9092   0.1411   -0.9589

همان‌طور که می‌بینیم، خروجی برای هر درایه ورودی محاسبه شده و محتوای b به صورت زیر است:

[(sin(2) sin(3) sin(5]

3۶. مثالی دیگر از توابع پایه با یک متغیر برداری

برنامه زیر را بنویسید و اجرا کنید.

خروجی برنامه برابر است با:

b = 18  31  69

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

[b = [2*(a(1))^2+3*a(1)+4 2*(a(2))^2+3*a(2)+4 2*(a(3))^2+3*a(3)+4

3۷. تعیین محتوای یک آرایه

برای آنکه محتوا و داریه‌های یک آرایه را تعیین کنیم، می‌توانیم مشابه مثال زیر عمل نماییم.

اگر برنامه بالا را اجرا کنید، خواهید دید که خروجی آن به صورت زیر خواهد بود:

a = 0  0.5  1  1.5  2  2.5  3  3.5  4

3۸. استخراج داریه از ماتریس

برنامه زیر را بنویسید و اجرا کنید.

خروجی این برنامه c=9 است. برای ماتریس A، دستورهای زیر درایه مورد نظر از آن را استخراج می‌کنند:

A(1,1) = 3,   A(1,2) = 5,    A(2,1) = 2,    A(2,2) = 4

3۹. مثالی از استفاده از اندیس برای یک ماتریس

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

خروجی این برنامه به صورت زیر است:

norm1 = 7.348

این برنامه نُرم اقلیدسی یک ماتریس را محاسبه می‌کند.

4۰. حل دستگاه معادلات خطی

برنامه زیر را اجرا کنید.

نتیجه حاصل از این برنامه به صورت زیر است:

x =  1
5
4

این برنامه، معادله را حل می‌کند و پاسخ آن برابر است با: .

41. حل دستگاه معادلات خطی

برنامه زیر را بنویسید و اجرا کنید:

خروجی این برنامه مشابه مثال قبل است. در این‌جا “A\b” معادل همان ” inv(A)*b” است.

بخش پنجم: رسم نمودار

روش‌های رسم نمودار در این بخش ارائه شده است.

42. یک مثال ساده از دستور plot

برنامه زیر را در متلب اجرا کنید:

نتیجه اجرای این برنامه شکل زیر خواهد بود:‌

شکل متلب

در دستور “(plot(a,b” آرایه “a” باید شامل داده‌های محوری باشد که می‌خواهیم نمودار را بر حسب آن رسم کنیم (متناظر با محور x). آرایه “b” نیز باید متناظر با مقادیر محور y باشد.

بعد از آنکه نمودار را رسم کردیم، می‌توانیم با ابزارهای تعاملی متلب آن را اصلاح کنیم. برای مثال، می‌توانیم برچسب (نام) محورهای x و y را به صورت دستی به نمودار اضافه کنیم. همچنین می‌توانیم نمودار را =با فرمت‌های مختلف (مانند tif ،jpg ،eps و..) ذخیره کنیم.

43. تعیین مشخصات یک شکل: الگو، رنگ و ضخامت خط

برنامه زیر را اجرا و نتیجه را مشاهده کنید.

نتیجه اجرای برنامه بالا شکل زیر خواهد بود:

نمودار متلب

عبارت ‘or-‘ در دستور plot الگوی خط را تعیین کرده است. این عبارت منجر به خط ممتد با ترکیب نمادهای دایره‌ای شده است. رنگ این دایره‌ها سبز است. دلیل وجود این رنگ، نوشتن عبارت ‘g’ برای ‘MarkerFaceColor’ است. شرح یا همان legend نمودار نیز در گوشه بالایی سمت چپ قاب تصویر نوشته شده است. این کار با اختصاص ‘NorthWest’ برای ‘Location’ ایجاد شده است.

44. رسم چند نمودار

برنامه زیر را بنویسید و آن را اجرا کنید.

خروجی این برنامه، نمودار زیر است:

نمودار متلب

در برنامه بالا، اگر از دستور “hold on” استفاده نکنیم، دستور plot دوم در خط بعد، در قاب نمودار قبلی رسم می‌شود و نمودار قبلی را حذف می‌کند.

4۵. رسم نمادها

دستورات زیر را بنویسید و آن را اجرا کنید.

خروجی این برنامه شکل زیر است:

رسم نمودار در متلب

4۶. رسم چند قاب نمودار در یک تصویر

برنامه زیر را در متلب بنویسید و آن را اجرا کنید.

شکل حاصل از اجرای این برنامه به صورت زیر خواهد بود:

دو نمودار در یک شکل

بخش ششم: تابع تعریف شده توسط کاربر

در این بخش، روش‌های تعریف توابعی را که می‌توانید برحسب نیازتان تعریف کنید و در توابع متلب وجود ندارند معرفی می‌کنیم.

4۷. چگونه یک تابع را تشکیل دهیم و از آن استفاده کنیم؟

ابتدا، یک برنامه متلب (New Script) را باز می‌کنیم. برای مثال، نام آن را myfunc1 قرار می‌دهیم و آن را با پسوند myfunc1.m ذخیره می‌کنیم. فرض کنید می‌خواهیم تابع را تعریف کنیم. این تابع به صورت زیر در متلب نوشته می‌شود:

متغیر “outcome” متغیری است که خودمان آن را تعریف کرده‌ایم و از آن برای برقراری رابطه با پارامتر ورودی “x” استفاده می‌کنیم. بعد از آنکه تابع مورد نظر را تعریف کردیم، می‌توانیم در برنامه‌ها یا توابع دیگری که می‌نویسیم آن را فراخوانی کنیم. برای مثال، فرض کنید برنامه‌ای با نام mainprog1.m به صورت زیر نوشته‌ایم:

خروجی این برنامه به صورت زیر است:

x = 0.10 f(x) = 7.3200
x = 0.20 f(x) = 7.6800
x = 0.30 f(x) = 8.0800
x = 0.40 f(x) = 8.5200
x = 0.50 f(x) = 9.0000

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

4۸. تابعی با چند پارامتر ورودی

تابع زیر را با نام myfunc2.m در نظر بگیرید که به صورت زیر است:

همان‌طور که دریافته‌اید، این برنامه تابع را تعریف می‌کند که ورودی‌های آن، b ،a ،x و c هستند.

این تابع را در برنامه دیگری با نام mainprog2.m به کار می‌بریم:

خروجی برنامه اخیر به صورت زیر است:

x = 0.10 f(x) = 7.3200
x = 0.20 f(x) = 7.6800
x = 0.30 f(x) = 8.0800
x = 0.40 f(x) = 8.5200
x = 0.50 f(x) = 9.0000

بخش هفتم: استفاده از فایل‌ها و دستورهای خارجی برای ورودی و خروجی

در این بخش شیوه استفاده از فایل‌ها و دستورات ورودی خارج از برنامه را بیان می‌کنیم. همچنین نحوه ایجاد فایل‌ها و دستورات در خروجی را بیان خواهیم کرد.

4۹. باز کردن یک فایل و نوشتن خروجی در آن

برنامه زیر را بنویسید و نتیجه آن را ببینید:

این برنامه خروجی خاصی که مانند مثال‌های قبل قابل رؤیت باشد تولید نمی‌کند. اما فایلی با نام “myoutput.txt” ایجاد می‌کند (در همان جایی که متلب ذخیره شده است). محتوای این فایل به صورت زیر است:‌

1    1     1
2   4    8
3   9   27
4   16  64

خط اول برنامه فایلی به نام ‘myoutput1.txt’ را باز می‌کند و نوع “W” به این معنی است که این فایل  “write only” است. پس از اجزای فرمان، متلب یک فایل ID یا شناسه را انتخاب خواهد کرد (که یک عدد است) و آن را در متغیر fID1 قرار خواهد داد. کاربر نیازی به دانستن آن عدد ندارد، اما اگر یک خروجی برای آن فایل باشد، باید از آن به عنوان شناسه استفاده شود.

دستور “(fprintf(fID1,’%7u %7u %7u \r’,b1,b2,b3” خروجی را به فایلی با ID یا شناسه fID1 هدایت می‌کند.اگر ID فایل داده نشده باشد، فرمان کوتاه “(fprintf(‘%7u %7u %7u \r’,b1,b2,b3” خروجی را در مکان پیش‌فرض نشان خواهد داد.

۵۰. خواندن داده از یک فایل موجود

برنامه زیر را در متلب بنویسید و آن را اجرا کنید.

نتیجه این کد به صورت زیر است:

1  +    1  + 1    =   3
2  +   4  + 8   =  14
3  +  9   + 27 =  39
4  +  16  + 64 =  84

فرض می‌کنیم فایل “myoutput1.txt” قبلاً توسط برنامه بخش 4۹ ایجاد شده است و به صورت صحیح در همان جایی که برنامه متلب را اجرا می‌کنیم ذخیره شده است. دستور نخست کد بالا، فایل “myoutput1.txt” را با وضعیت تعیین شده “r” به معنای “read only” باز می‌کند. دستور “(b = fscanf(fID1,’%7u%7u %7u \r’,3” یک رکورد را از فایل خارجی با ID=ID1 با استفاده از فرمت ‘%7u %7u %7u \r’ می‌خواند. عدد “3” بعد از این عبارت مشخص می‌کند که فقط 3 عنصر اول این رکورد خوانده شده و در آرایه “b” قرار داده می‌شوند.

۵1. ایجاد خط فرمان برای وارد کردن ورودی توسط کاربر

برناامه زیر را بنویسید و اجرا کنید.

برنامه بالا حالتی خاصی از وقتی است که ورودی از یک فایل خارجی خوانده نمی‌شود، بلکه توسط کاربر و با یک خط فرمان وارد می‌شود. خروجی برنامه بالا به عددی بستگی دارد که کاربر وارد می‌کند (در متغیر “num1” ذخیره می‌گردد) که بزرگتر از 1۷ است یا کوچکتر از آن.

اگر بخواهیم ورودی یک رشته باشد (مثلاً “YES” یا “Fara Dars”)، باید از گزینه “s” استفاده کرده و آن را به دستور اضافه کنیم. برای مثال  “(‘name1 = input(‘Enter your surname’, ‘s”.


منبع: فرادرس