افرا گرافیک

گروه مشاوران طراحی افرا در زمینه انواع امور طراحی ، چاپ، طراحی سایت و مالتی مدیا فعالیت می کند. 66120694 و 66120698 و 09122246022

افرا گرافیک

گروه مشاوران طراحی افرا در زمینه انواع امور طراحی ، چاپ، طراحی سایت و مالتی مدیا فعالیت می کند. 66120694 و 66120698 و 09122246022

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

آموزش جاوا اسکریپت                                                                                    قسمت هفتم

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

توابع جاوا اسکریپت :

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

مثال :

<html>

<body>

    <p>This example calls a function which performs a calculation, and returns the           result:</p>

    <p id="demo"></p>

    <script>

        function myFunction(a, b) {

        return a * b;

      }

      document.getElementById("demo").innerHTML = myFunction(4, 3);

    </script>

</body>

</html>

خروجی : 12

قواعد دستوری توابع جاوا اسکریپت :

  • یک تابع جاوا اسکریپت است  با کلمه کلیدی function به همراه یک پرانتز باز و بسته در مقابل نام آن تعریف شده است
  • نام تابع می تواند شامل حروف، ارقام ، اهمیت ، و علائم دلار ( قوانین همان متغیر) .
  • پرانتز می تواند شامل یک یا چند پارامتر باشد که با کاما از هم جدا شده اند : (parameter1, parameter2, ...)
  •  کدی که توسط تابع اجرامی شود داخل کروشه قرار میگیرد

 

function name(parameter1, parameter2, parameter3) {
    code to be executed
}

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

 

فراخوانی توابع جاوا اسکریپت :

   کد درون تابع زمانی که تابع اعلان (تعریف) می شود، بلافاصله اجرا نمی گردد، بلکه تنها زمانی اجرا می گردد که تابع فراخوانی   (invoke) شود مانند :

  •    زمانی که یک رویداد رخ می دهد ( زمانی که کاربر یک دکمه را کلیک می کند )
  •    زمانی که درون کد های جاوا اسکریپت صدا زده می شود
  •    به صورت خودکار ( خود استناد )

مقدار بازگشتی تابع :

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

مثال :

 

var x = myFunction(4, 3);      

function myFunction(a, b) {
    return a * b;    
}

خروجی  : 12

 

 

 

چرا توابع ؟

شما می توانید یک کد را یک بار تعریف کرده و چندین بار استفاده کنید

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

 

پایان قسمت هفتم

منابع : http://www.w3schools.com/js/js_functions.asp

کانون تبلیغاتی افراگرافیک

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

66912056  66562677 66120698   09122246022

http://afragraphic.ir

info@afragraphic.ir

https://telegram.me/afragraphic_ir

http://instagram.com/afragraphic1390

http://facebook.com/AfraGraphic

http://plus.google.com/104048725792771050756

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

http://twitter.com/afragraphic

http://ir.linkedin.com/in/afragraphic

http://aparat.com/afragraphic

http://Telegram.me/afragraphic_ir

http://cloob.com/name/afragraphic

اپراتور typeof | آموزش جاوا اسکریپت | برنامه نویسی

آموزش جاوا اسکریپت                                                              قسمت ششم

اپراتور typeof :

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

در جاوا اسکریپت برای مشخص کردن نوع یک متغیر می توانید از اپراتور typeof استفاده کنید

 

 // Returns string

typeof "John" 

// Returns number

typeof 3.14 

// Returns boolean

typeof false

// Returns object

typeof [1,2,3,4]

// Returns object

typeof {name:'John', age:34}

مثال :

 

<p id="demo"></p>

<script>

     document.getElementById("demo").innerHTML =

     typeof "john" + "<br>" +

    typeof 3.14 + "<br>" +

    typeof false + "<br>" +

    typeof [1,2,3,4] + "<br>" +

    typeof {name:'john', age:34};

</script>

خروجی :

string
number
boolean
object
object

آرایه ها در جاوا اسکریپت یک نوع خاص از شی هستند بنابراین اپراتور typeof نوع [typeof [1,2,3,4 را شی بر می گرداند

 

داده تعریف نشده (undefined ) :

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

 // Value is undefined, type is undefined

 var person;                  

هر متغیر را می توان با تنظیم مقدار تعریف نشده خالی کرد نوع آن نیز تعریف نشده می باشد

// Value is undefined, type is undefined

 

person = undefined;

 

مقادیر تهی  :

یک مقدار تهی با نوع داده تعریف نشده متفاوت است. هر متغیر رشته ای هم دارای نوع داده و هم مقدار است

// The value is "", the typeof is string

var car = ""; 

 

مثال :

<p id="demo"></p>

<script>

   var car = "";

   document.getElementById("demo").innerHTML =

   "The value is: " +

   car + "<br>" +

   "The type is:" + typeof car;

</script>

خروجی :

The value is: 
The type is:string

Null (پوچ) :

 

  • متاسفانه در جاوا اسکریپت نوع داده null  یک شی است.
  • می توان این مسئله را یک bug در برنامه نویسی جاوا اسکریپت دانست.
  • در جاوا اسکریپت null برابر «هیچی» است یعنی چیزی است که وجود ندارد.

 

 // Value is null, but type is still an object

var person = null;

 

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

// undefined

typeof undefined  

// object

typeof null

 // false

null === undefined 

// true

null == undefined  

 

پایان قسمت ششم

منابع : http://www.w3schools.com/js/js_datatypes.asp

کانون تبلیغاتی افراگرافیک

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

66912056  66562677 66120698   09122246022

http://afragraphic.ir

info@afragraphic.ir

https://telegram.me/afragraphic_ir

http://instagram.com/afragraphic1390

http://facebook.com/AfraGraphic

http://plus.google.com/104048725792771050756

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

http://twitter.com/afragraphic

http://ir.linkedin.com/in/afragraphic

http://aparat.com/afragraphic

http://Telegram.me/afragraphic_ir

http://cloob.com/name/afragraphic

 

داده در جاوا اسکریپت | آموزش جاوا اسکریپت | طراحی سایت

آموزش جاوا اسکریپت                                                                                 قسمت پنجم

انواع داده در جاوا اسکریپت :

در این بخش از آموزشهای طراحی سایت به چند اپراتور ویژه در جاوااسکریپت میپردازیم.

StringNumberBooleanArrayObject

متغیرهای جاوا اسکریپت می توانند در انواع داده های اعداد، رشته ها ، آرایه ها، اشیاء و ... نگه داری شوند 
 

اعداد

var length = 16;

رشته

var lastName = "Johnson";

آرایه

var cars = ["Saab", "Volvo", "BMW"];

اشیاء

var x = {firstName:"John", lastName:"Doe"};

 

مفهوم انواع داده :
  •  در برنامه نویسی، انواع داده یک مفهوم مهم است
  • برای اینکه عملگر ها بتوانند بر روی متغیر ها عمل کنند نیاز است نوع آن ها مشخص شود
  • یک کامپیوتر عبارت زیر را نمی تواند درک کند :
var x = 16 + "Volvo";

 

این عبارت چه مفهمومی دارد؟آیا با یک خطا مواجه می شویم یا این عبارت دارای یک نتیجه می باشد؟
و اما راه حل جاوا اسکریپت برای اینکه کامپیوتر عبارت بالا رو درک کنه:

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

مثال :

<p id="demo"></p>
<script>
      var x = 16 + "Volvo";
     document.getElementById("demo").innerHTML = x;
</script>

خروجی : 16Volvo

 

 

 

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

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

مثال 1 :

<p id="demo"></p>

   <script>

   var x = 16 + 4 + "Volvo ";

   document.getElementById("demo").innerHTML = x;

</script>

ابتدا از سمت چپ به راست 16 + 4 به صورت نوع عددی با هم جمع میشوند وسپس حاصل آن ها به صورت نوع رشته ای به Volvo  متصل می شود

خروجی : 20Volvo

مثال 2 :

<p id="demo"></p>

<script>

    var x = 16 + 4 + "Volvo";

    document.getElementById("demo").innerHTML = x;

</script>

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

خروجی : Volvo164

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

 

var x;               // نوع داده تعریف نشده
var x = 5;           // نوع داده عددی
var x = "John";      // نوع داده رشته ای

                                                         

رشته ها در جاوا اسکریپت:

  • یک رشته یا یک کلمه  یک سری از کاراکتر های پشت سر هم می باشد
  • رشته ها بین دو علامت کوتیشن " "  قرار میگیرند.شما می توانید از تک کوتیشن   ‘ ’ یا جفت کوتیشن استفاده کنید

var carName = "Volvo XC60";   // استفاده از دابل کوتیشن
var carName = 'Volvo XC60';   // استفاده از تک کوتیشن

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

var answer = "He is called 'Johnny'";    // استفاده از کوتیشین درون جفت کوتیشن

 

اعداد جاوا اسکریپت :
                                                            
  • در جاوا اسکریپت فقط یک نوع داده عددی وجود دارد.
  • اعداد میتواند اعشاری یا صحیح باشند.

var x1 = 34.00;     // نوع داده اعشاری
var x2 = 34;        // نوع داده صحیح

  • اعداد خیلی بزرگ یا اعداد خیلی کوچک را میتوان با نماد e نوشت

var y = 123e5;      // 12300000
var z = 123e-5;     // 0.00123

Booleans در جاوا اسکریپت :

نوع داده بولین فقط دو مقدار True  و  False  را دارا می باشد.

var x = true;
var y = false;

نوع داده بولین برای تست در شرط ها استفاده می شود

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

 

مثال 2 :

var cars = ["Saab", "Volvo", "BMW"];

یک آرایه سه عنصری به نام cars

اشیاء جاوا اسکریپت :
در جاوا اسکریپت آبجکت یا همان اشیاء بین علامت آکولاد نوشته می شود.
اشیا در جاوا اسکریپت به صورت نام و مقدار (مقدار خصیصه : نام خصیصه) می باشد
 

مثال  : یک شی با نام person شامل چهار خصیصه  firstName و  lastName و  age و eyeColor می باشد

<p id="demo"></p>

<script>

   var person = {

       firstName : "John",

       lastName  : "Doe",

       age       : 50,

       eyeColor  : "blue"

    };

   document.getElementById("demo").innerHTML =

   person.firstName + " is " + person.age + " years old.";

</script>

خروجی : John is 50 years old

 

پایان قسمت پنجم

منابع : http://www.w3schools.com/js/js_datatypes.asp

کانون تبلیغاتی افراگرافیک

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

66912056  66562677 66120698   09122246022

http://afragraphic.ir

info@afragraphic.ir

https://telegram.me/afragraphic_ir

http://instagram.com/afragraphic1390

http://facebook.com/AfraGraphic

http://plus.google.com/104048725792771050756

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

http://twitter.com/afragraphic

http://ir.linkedin.com/in/afragraphic

http://aparat.com/afragraphic

http://Telegram.me/afragraphic_ir

http://cloob.com/name/afragraphic

 

 

قواعد دستوری (syntax) جاوا اسکریپت |آموزش جاوا اسکریپت|بهینه کردن سایت

آموزش جاوا اسکریپت                                                                 قمست چهارم

قواعد دستوری(syntax)  جاوا اسکریپت :

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

در یک زبان برنامه نویسی به این دستورالعمل ها statements نامیده می شوند

جاوا اسکریپت یک زبان برنامه نویسی می باشد (که ما از آن در طراحی وبسایت استفاده می کنیم)

دستورات جاوا اسکریپت مانند برخی از زبان ها  از جمله C#,Vb  با (;) از هم جدا می شوند

<script>

   var x = 5;

   var y = 6;

   var z = x + y;

   document.getElementById("demo").innerHTML = z;

</script>

<script>

   var x = 5;

   var y = 6;

   var z = x + y;

   document.getElementById("demo").innerHTML = z;

</script>

دستورات (statemens) جاوا اسکریپت :

در زبان های برنامه نویسی به دستورالمل های برنامه اصطلاحا (statatements) جملات،دستورات گفته می شود.

 

دستورات  جاوا اسکریپت از موارد زیر تشکیل شده است : 

 

  1. Values  (مقادیر)
  2. Operators (عملگرها)
  3. Expressions  (اصطلاحات)
  4. Keywords (کلمات کلیدی)
  5. Comments (تفسیر نویسی)

 

 

جاوا اسکریپت  Values  (مقادیر) :

 

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

  1. مقادیر ثابت (Fixed Values) که به آنها لیترال ها (Literals) یا مقادیر تحت اللفظی گفته می شود.
  2. مقادیر متغیر  (Variable Values)

لیترال ها (Literals) یا ثابت  (Fixed) :

مهم ترین قوانین برای نوشتن مقادیر ثابت : 
 

   ۱- استفاده از اعداد (ساده یا اعشار) مانند   :  10.50و 1001
   ۲-استفاده از رشته ها (متن) که بین سینگل کوتیشن یا دابل کوتیشن نوشته میشود.مانند “afra” و ‘afra’

جاوا اسکریپت  متغیرها (Variables):

در تمامی زبان های برنامه نویسی از متغیر ها برای ذخیره موقت داده استفاده می گردد.
در جاوا اسکریپت برای تعریف یک متغیر از کلمه کلیدی var استفاده می شود.
از علامت “=” مساوی  برای معرفی مقداری که میخواهیم در متغیر ذخیره کنیم استفاده میکنیم.
مثال :

در مثال زیر یک متغیر x تعریف شده و مقدار 6 به آن انتصاب داده شده است

 

<script>

   var x;

   x = 6;

   document.getElementById("demo").innerHTML = x;

</script>

جاوا اسکریپت  Operators (عملگرها) :

  • جاوا اسکریپت از عملگر = برای انتساب مقدار به متغیر استفاده می کند

مثال : 

var x = 5 ;

var y = 6 ;

  • جاوا اسکریپت از عملگر های محاصباتی  (+ - *  /)  برای محاصبه مقادیر استفاده می کند

مثال : 

 

<p id="demo"></p>

<script>

    document.getElementById("demo").innerHTML = (5 + 6) * 10;

</script>

 

جاوا اسکریپت  Expressions  (اصطلاحات) :

یک اصطلاح از ترکیب مقادیر (Values) ، متغیر ها (Variables) و عملگرها (Operators) که در یک مقدار (Value) محاسبه شده است گفته میشود

مثال : 

5 * 10

x * 10

"John" + " " + "Doe"

جاوا اسکریپت  Keywords (کلمات کلیدی) :

 

از کلمات کلیدی در جاوا اسکریپت برای شناختن عمل های از پیش تعریف شده استفاده می شود.
بطور مثال var یک کلمه کلیدی می باشد که برای ایجاد یک متغیر استفاده می شود.

جاوا اسکریپت  Comments (تفسیر نویسی) :

برخی عبارات در جاوا اسکریپت اجرا نمی شوند.
عباراتی که بعد از علامت ” // ” یا بین دو علامت /*  و  */ تفسیر نویسی یا کامنت گفته میشود و اجرا نمی شوند.

نوشتن کانت یا تفسیر نویسی اختیاری می باشدو فقط به خواناتر شدن بهینه سازی کدها و کارایی آنها کمک میکند

var x = 5;   // I will be executed

// var x = 6;   I will NOT be executed

جاوا اسکریپت  شناسه ها (Identifiers):

  • شناسه ها همان نام ها هستند.
  • در جاوا اسکریپت از شناسه ها برای نام گذاری متغیرها ، کلمات کلیدی ، فانکشن ها و برچسب ها(labels) استفاده میشود

 

  • قوانین نام گذاری در جاوا اسکریپت همانند دیگر زبان های برنامه نویسی می باشد:

 

           اولین کارکتر در نام گذاری یا باید یکی از حروف لاتین یا آندرلاین “_” یا علامت دلار $ باشد.

           کارکتر های بعدی میتوانند یکی یا ترکیبی از حروف لاتین یا علائم ریاضی یا آندرلاین یا علامت دلار باشد.

 

نکته : تمامی شناسه ها در جاوا اسکریپت حساس به کوچکی و بزرگی حروف هستند و براشون حرف  A و a متفاوته.

پایان قسمت چهارم

منابع : http://www.w3schools.com/js/js_output.asp

کانون تبلیغاتی افراگرافیک

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

66912056  66562677 66120698   09122246022

http://afragraphic.ir

info@afragraphic.ir

https://telegram.me/afragraphic_ir

http://instagram.com/afragraphic1390

http://facebook.com/AfraGraphic

http://plus.google.com/104048725792771050756

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

http://twitter.com/afragraphic

http://ir.linkedin.com/in/afragraphic

http://aparat.com/afragraphic

http://Telegram.me/afragraphic_ir

http://cloob.com/name/afragraphic

 

خروجی جاوا اسکریپت|آموزش جاوا اسکریپت|طراحی سایت

آموزش جاوا اسکریپ                                                                                قسمت 3

 

خروجی جاوا اسکریپت :

 

  • جاوا اسکریپت می تواند داده ها را در روش های مختلف نمایش می دهد :
  1. نمایش خروجی در یک کادر هشدار با استفاده از () window.alert
  2. نمایش خروجی در سند  html  با استفاده از  () document.write 
  3. نمایش خروجی در یک عنصر html با استفاده از () innerHTML 
  4. نمایش خروجی در کنسول مرورگر با استفاده از () console.log

خروجی با استفاده از () window.alert :
 
شما می توانید از یک جعبه هشدار برای نمایش داده ها استفاده کنید

مثال :

<!DOCTYPE html>
<html>
<body>
  <h1>My First Web Page</h1>
  <p>My first paragraph.</p>
  <script>
    window.alert(5 + 6);
  </script>
</body>
</html>

خروجی :

 

خروجی با استفاده از ()document.write :
برای تست کردن وب سایت راحت ترین روش استفاده از  ()document.write می باشد .
مثال :
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>

 خروجی :

 استفاده از ()document.write بعد از لود شدن کامل صفحه وب سبب پاک شدن کل سند html  صفحه شما می شود

 
مثال :
 

<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<button onclick="document.write(5 + 6)">Try it</button>
</body>
</html>

خروجی : پس از کلیک بر روی button کل صفحه html پاک شده و 11 در خروجی نمایش داده می شود

 
 
نکته : از روش ()document.write باید تنها برای تست وب سایت استفاده شود
خروجی با استفاده ازinnerHTML :

 برای دسترسی به یک عنصر HTML در جاوا اسکریپت می توانیدازکد (document.getElementById(id 

استفاده کنید.

مثال :
 
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My First Paragraph</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>
</body>
</html>

 

خروجی :

 

خروجی با استفاده از   ()console.log :

 

شما می توانید از روش ()console.log برای نمایش داده ها در مرورگر شما ، استفاده کنید.
 
مثال :
 
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
console.log(5 + 6);
</script>
</body>
</html>

 

 

پایان قسمت سوم

منابع : http://www.w3schools.com/js/js_output.asp

کانون تبلیغاتی افراگرافیک

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

66912056  66562677 66120698   09122246022

http://afragraphic.ir

info@afragraphic.ir

https://telegram.me/afragraphic_ir

http://instagram.com/afragraphic1390

http://facebook.com/AfraGraphic

http://plus.google.com/104048725792771050756

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

http://twitter.com/afragraphic

http://ir.linkedin.com/in/afragraphic

http://aparat.com/afragraphic

http://Telegram.me/afragraphic_ir

http://cloob.com/name/afragraphic