loading...
صفحه اصلی آرشیو تماس با ما

آموزش هاستینگ

آموزش راه اندازی هاستینگ و مباحث فنی مرتبط به هاستینگ

منیجر بازدید : 1 دوشنبه 06 اسفند 1397 نظرات (0)
تاریخچه

جاوا اسکریپت را در ابتدا شخصی به نام Brendan Eich در شرکت Netscape با نام Mocha طراحی نمود. این نام بعدا به LiveScript و نهایتا به جاوا اسکریپت تغییر یافت. [۲] این تغییر نام تقریبا با افزوده شدن پشتیبانی از جاوا در مرورگر وب Netscape Navigator همزمانی دارد. اولین نسخهٔ جاوا اسکریپت در نسخه 2.0B3 این مرورگر در دسامبر 1995 معرفی و عرضه شد. این نام گذاری منجر به سردرگمی های زیادی شده و این ابهام را ایجاد می‌کند که جاوا اسکریپت با جاوا مرتبط است در حالی که این طور نیست. عدهٔ زیادی این کار را یک ترفند تجاری برای به دست آوردن بخشی از بازار جاوا که در آن موقع زبان جدید مطرح برای برنامه نویسی تحت وب بود می‌دانند. .

به دلیل موفقیت عمدهٔ جاوا اسکریپت در نقش زبان نویسه ای سمت کارخواه (client side scripting language) برای صفحات وب، مایکروسافت یک نسخه سازگار از این زبان را ایجاد کرد و به علت مشکلات حقوقی آن را Jscript نامید. این زبان در نسخه 3.0 از مرورگر Internet Explorer و در آگوست 1996 داده شد. تفاوت های این دو زبان به حدی جزیی است که اغلب Jscript و جاوا اسکریپت به جای هم به کار می‌روند. هرچند که مایکروسافت در اینجا چند ده دلیل برای تفاوت Jscript با استاندارد ECMA مطرح می‌کند.

Netscape جاوا اسکریپت را به سازمان Ecma International برای استاندارد سازی ارسال کرده است و نتیجه نسخهٔ استاندارد شده‌ای به نام ECMA Script است.

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


امکانات زبانی

امکانات زیر (در صورت قید نشدن) همگی مطابق استاندارد ECMA Script می‌باشند.

زبان امری و ساخت یافته

جاوا اسکریپت از تمامی نحو ساختاری زبان C پشتیبانی می‌کند. مانند گزاره (if و switch و حلقه‌های while و ...) یک مورد استثنا تعیین حوزهٔ متغییر هاست: تعریف حوزه در حد block در جاوا اسکریپت وجود ندارد. هر چند جاوا اسکریپت 1.7 با کلمهٔ کلیدی let این نوع حوزه دهی را امکان پذیر می سازد. مانند c در جاوا اسکریپت بین عبارت و گزاره تفاوت وجود دارد.

پویایی
تایپ دهی پویا

مانند اکثر زبان های نویسه‌ای تایپ به مقدارها منسوب می‌گردد و نه به متغییرها. برای مثال متغییر x ممکن است به یک عدد وابسته سازی شود، و بعدا به یک رشته. جاوا اسکریپت برای تعیین تایپ شی راه‌های مختلفی از جمله تایپ دهی اردکی (duck typing) را دارد. [۷]


تایپ دهی ضعیف

زبان جاوا اسکریپت از نظر تایپ دهی ضعیف به شمار می‌آید و در آن نتیجهٔ عملیاتی مانند 5 + “37”، عبارت “537” خواهد بود. (عدد را با رشته جمع کرده است)
اشیا به دید آرایه‌های انتسابی

جاوا اس***پت تقریبا تماما بر اساس اشیا است. اشیا، آرایه‌های انتسابی به همراه یک «ساختار شماتیک» هستند. نام ویژگی اشیا، کلیدهای آرایه انتسابی هستند و درواقع obj.x = 10 با obj[“x”] = 10 هم ارز هستند و شیوه نگارش با نقطه صرفا یک سهولت نحوی است. ویژگی ها و مقدارهایشان در زمان اجرا قابلیت تغییر اضافه و حذف دارند. همچنین می‌توان روی ویژگی های یک شی با ساختار for … in پیمایش کرد.
ارزیابی در زمان اجرا

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

تابعی بودن
تابعی بودن

توابع موجوداتی «درجه اول» محسوب می‌شوند، یعنی خود یک شی هستند. بنابراین می‌توانند ویژگی داشته باشند، در آرگومان های تابع ها داده شوند و مانند هر شی دیگری با آن ها رفتار شود
توابع داخلی و بستارها

توابع داخلی (توابع تعریف شده داخل یک تابع دیگر) هر بار که تابع بیرونی فرا خوانده شود، ایجاد می‌شوند و متغییرهای توابع بیرونی تا زمانی که تابع داخلی وجود داشته باشد، وجود خواهند داشت، حتی پس از اتمام آن فراخوانی از تابع بیرونی. (مثال: اگر تابع داخلی به عنوان مقدار برگشتی تابع باشد، هنوز به متغییرهای تابع بیرونی دسترسی دارد) – این مکانیزم بستار گرفتن در جاوا اسکریپت است.

«ساختار شماتیک» محوری
ساختار شماتیک

جاوا اسکریپت به جای رده‌ها برای تعریف ویژگی های اشیا، که شامل متد ها و وراثت است از «ساختار شماتیک» استفاده می‌کند (prototype). امکان شبیه سازی بسیاری از امکانات رده-محور با ساختار های شماتیک جاوا اسکریپت امکان پذیر است.
توابع در نقش سازندهٔ اشیا

برای توابع علاوه بر نقش عادی، به عنوان سازنده ی اشیا هم عمل می‌کنند. آوردن یک new قبل فراخوانی تابع، آن را با کلمهٔ کلیدی this وابسته سازی شده به شی جدید اجرا می‌کند.ویژگی prototype از تابع مورد نظر، ساختار شماتیک شی جدید را مشخص می‌کند.
توابع در نقش متد

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

امکانات دیگر
امکانات دیگر

جاوا اسکریپت برای تامین اشیا و متدها که با آن ها تعامل کند به یک محیط اجرایی (مانند مرورگر وب) نیاز دارد تا بتواند به این ترتیب با دنیای خارج ارتباط برقرار کند. همچنین برای دسترسی به سایر نویسه‌ها (include) هم به این محیط نیازمند است (مانند تگ <script>در HTML ) . (البته این یک ویژگی زبانی نیست اما در عمل اغلب این طور پیاده سازی شده است)
تعداد متغییر پارامتر (variadic)

تعداد نامعینی پارامتر را می‌توان به یک تابع ارسال نمود. تابع می‌تواند هم از طریق پارامترهای رسمی و هم از طریق شی محلی arguments به آن ها دسترسی داشته باشد.
Literalهای آرایه و شی

مانند بسیاری از زبان های نویسه‌ای آرایه‌ها و اشیا (که در زبان های دیگر همان آرایه‌های انتسابی هستند) را می‌توان با یک نحو موجز ایجاد و توصیف نمود. در واقع این شیوهٔ نگارش پایهٔ قالب داده‌ای JSON هم هست.
عبارات منظم

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

نظام تایپ دهی

انواع زیر جزو انواع داده‌های قابل دسترس در زبان جاوا اسکریپت است. در استاندارد ECMA انواع دیگری هم تعریف شده که صرفا داخلی است و برای پیاده سازی است. [۸]

تعریف نشده: این تایپ فقط یک مقدار با نام undefined دارد و متعلق به تمام متغییرهای مقدار دهی نشده است

نوع تهی: نوع تهی هم فقط یک مقدار دارد با نام null

نوع دودویی: نمایندهٔ یک مقدار منطقی است و دو مقدار true و false را می پذیرد.

نوع رشته: در بر گیرندهٔ تمام رشته‌های متناهی از 0 یا بیشتر عنصر 16 بیتی بدون علامت است. این عناصر با اندیس های نامنفی قابل دسترسی هستند. طول رشته تعداد عناصر داخل آن و طول رشتهٔ تهی برابر 0 است.

زمانی که رشته حاوی متن واقعی باشد هر عنصر به عنوان یک واحد UTF-16 در نظر گرفته می‌شود (مستقل از این که شیوهٔ واقعی نگه داری رشته چه باشد). تمام عملیات بر روی رشته‌ها آن ها را به عنوان اعداد صحیح بدون علامت در نظر می‌گیرند و تضمین کنندهٔ تولید رشته به حالت normalize شده نیست و تضمین های خاص زمانی هم ندارد. علت این تصمیم گیری سادگی در پیاده سازی ذکر شده است.

نوع عدد: نوع عدد در جاوا اسکریپت مطابق با استادارد IEEE برای اعداد شناور دودویی است (با اندکی تفاوت).

نوع شی: شی در جاوا اسکریپت یک مجموعه بدون ترتیب از ویژگی ها است. هر ویژگی می‌تواند داخلی، فقط-خواندنی، غیر قابل حذف، و غیر قابل پیمایش باشد (یا ترکیبی از این ها یا هیچ کدام)


تبدیلات خودکار

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


زمانی که بخواهد یک if را ارزیابی کند یا از عملگرهای منطقی ! و && و || استفاده شود، تبدیل به نوع دودویی را انجام می‌دهد. مقادیر 0 و 0- وNaN به false و سایر مقادیر عددی به true نگاشت می‌گردد. همچنین رشتهٔ تهی false و سایر رشته‌ها true در نظر گرفته می‌شود. انواع شی و تابع true و undefined و null هم false در نظر گرفته می‌شود.

زمانی که یکی از عملوند های عملگر + رشته باشد، تبدیل به رشته صورت می‌گیرد، مانند 5 + “37” که می‌شود “537”

عملگرهای دیگری عددی (جز جمع) منجر به تبدیل به عدد می‌گردد مانند 3 – “57” که مقدار عددی 34- را به دست می‌دهد.



مثال

چند برنامه ساده به جاوا اسکریپت

برنامه‌های ورودی و خروجی در مرورگر وب:
<script type="text/javascript">
alert ("Hello world");
var x = prompt("Enter Name:", "Default name");
alert ( "Hello, " + x )
</script>


برای استفاده ساده از عناصر HTML و DOM:
<script type="text/javascript">
document.write("Hello world");
function handle() {
document.write("You entered: " + document.getElementById("myinput").value );
}
</script>

<form>
<input type="text" id="myinput"/>
<input type="button" onclick="handle()" value="Click here" />
</form>

برنامه sort:
<script type="text/javascript">
var myarray = [1,5,8,2,3,0,2,9,11];
var i = 0;
var j = 0;
for (i = 0; i < myarray.length ; ++i )
{
for (j = 0; j < myarray.length; ++j)
{
if (myarray[i] < myarray[j])
{
var tmp = myarray[i];
myarray[i] = myarray[j];
myarray[j] = tmp;
}
}
}

for (i = 0; i < myarray.length; ++i)
{
document.write (myarray[i] + " " );
}
</script>

برنامه swap:
<script type="text/javascript">
var a = 10, b = 40;
[a,b] = [b,a]
alert("" + a + " " + b);
</script>

برنامه factorial:
<script type="text/javascript">
function factorial(x) {
if (x > 0)
return x * factorial(x-1);
return 1;
}
alert(factorial(5));
</script>
منبع: ویکی پدیا
درباره JavaScript ,
منیجر بازدید : 3 يكشنبه 11 آذر 1397 نظرات (0)
سلام دوستان
چطور میتوانم یک متغیر را تعریف کنم که مقدارش را از متود get فرم دریافت کند
این صفحه index.php من است که یک مقدار را در داخل کد php به صفحه test.php منتقلل میکنم
منتها در صفحه test.php در قسمت جاوا اسکریپت نمییدونم چطور متغیر url مقدارش را از صفحه قبل در قسمت
<a href=test2.php?links=$addlinks>
از links بگیرد
یعنی هر چی تو links هست تو صفحه بعد بریزه تو url
این صفحه index.php
کد PHP: <style type="text/css">

#lin:hover{background-color:#555}

}


</style>
<?php

if($_POST[submit]){
    $addlinks=$_POST[name];
    
echo "<div  id=lin  onClick=countdown()  ><a href=test2.php?links=$addlinks>$addlinks</a></div>";
}

?>
<html>

 


<body>
<div id="a">
<form name="form" method="post" action="index2.php">
<input type="text"  name="name" id="lk" />
<input type="submit" name="submit" value="send"  />
</form>

</div>
</body>
</html> , و این صفحه test.php دوستان توجه کنند که قسمتی که فارسی تایپ کردم را نمیدونم چی کار کنم که
هر چی تو links هست تو این صفحه بریزه تو url
کد PHP: <script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    var num=10;
    
    function countdown(){
        var url=(مقدار چطور  links را از صفحه index.php بگیرد) ;
                 setTimeout(countdown, 1000);
                 $(#a).html("redirect in"+num+"seconds");
                 num--;
                 if(num==0){
                 window.location.href =url;
                 num=0;}
                 }
                 
 
               });

</script>
<div id="a">


</div> 
درباره JavaScript ,
منیجر بازدید : 8 چهارشنبه 30 آبان 1397 نظرات (0)
با سلام و عرض خسته نباشید به دوستان عزیز
من چندین مشکل و سوال در مورد JW Player به آدرس https://www.jwplayer.com دارم
1- آیا این پلیر رایگان می باشد؟ و میتوان به صورت نامحدود از آن استفاده کرد؟
من نسخه JW Player را راه اندازی کرده ام و چندین مشکل در مورد آن دارم.

به طور مثال کد نمایش فیلم به صورت زیر باشد
کد PHP: <script src="jwplayer.js"></script>
<div id="mediaplayer">Loading</div>
<script type=text/javascript>
    jwplayer(mediaplayer).setup({
    key: "key",
    autostart: (false || autoplay ),
    flashplayer: "jwplayer.flash.swf",
    primary: "Html5",
    volume: 80,
    width: "100%",
    height: "100%",
    aspectratio: "16:9",
    androidhls: true,
    stagevideo: true,
    preload: "none",
    hlshtml: true,
    primary: renderingMode,
    startparam: "start",
    skin: "seven",            
    file: "play.mp4",

        });
    </script> 
حال میخواهیم محتویات یک آی فریم را قبل از پخش فیلم حدود 10 ثانیه نمایش داده شود باید چکار کنیم
یعنی وقتی بازدید کنند بر روی دکمه play کلیک میکند ابتدا آی فریم مورد نظر ده ثانیه نمایش داده شود و بعد از اتمام فیلم نمایش داده شود

با تشکر
درباره JavaScript ,
منیجر بازدید : 7 چهارشنبه 02 آبان 1397 نظرات (0)
امروز در این مقاله می خواهیم نحوه ی ساخت هدر ثابت ( در زمان اسکرول کردن ) که در حال حاضر خیلی هم پر کاربرد هستند رو یاد بدیم.
یکی از دلیل استفاده از این نوه هدر ها اینکه که دیگه کمتر برای کاربرامون مزاحمت ایجاد می کنه و در اصطلاح خیلی کاربر پسند یا User Friendly تر هستند.
ما ابتدا برای آموزش بهتر از یه ساختار ساده ای شروع می کنیم و بعد کارمون رو رو با css و javascript به طور پیچیده تر و حرفه ای تر پیاده سازی می کنیم. قبل از اینکه بحث رو ببندیم ، ما به طور مختصر در هنگام حل این مشکل کد هامون رو به طور بهینه شده می نویسیم و تغییرات را اعمال می کنیم.
کد های HTML

ما این تمرین خودمون رو با تگ های header , nav , ... و دیگر تگ های تو در تو پیش می بریم.
Logo

AboutServicesPortfolioContact
☰تگ nav که قسمتی از header است داری 3 المان می باشد . logo , main menu , و همچنین از یه button هم برای این که برای ما منو رو در هنگام ریسپانسیو شدن نمایش دهد استفاده می کنیم.(below 1061px)

CSS اولیه

ابتدا اجازه بدین تا نگاهی به کد های CSS بندازیم تا کمی بیشتر وارد داستان بشیم:

header {
position: fixed;
top: 0;
width: 100%;
padding: 20px;
box-sizing: border-box;
background: #DD3543;
}

nav {
display: flex;
align-items: flex-end;
justify-content: space-between;
transition: align-items .2s;
}

.logo {
font-size: 2rem;
display: inline-block;
padding: 20px 30px;
background: #F35B66;
color: #fff;
margin: 50px 0 0 50px;
transition: all .2s;
}

ul {
display: flex;
margin: 50px 50px 0 0;
padding: 0;
transition: margin .2s;
}

li:not(:last-child) {
margin-right: 20px;
}

li a {
display: block;
padding: 10px 20px;
}

.toggle-menu {
display: none;
font-size: 2rem;
color: #fff;
margin: 10px 10px 0 0;
transition: margin .2s;
}

main {
display: block;
padding: 0 20px;
}

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

پوزیشن برای تگ header ما fix می باشد. (position:fixed)ما برای طراحی تگ nav از flexbox استفاده کرده ایم.لوگو ما margin-top:50px و margin-left:50px دارد.و علاوه بر اون ما به اوگو خودمون ویژگی padding: 20px 30px هم داده ایم.دکمه ای که برای ریسپانسیو بودن ترتیب داده ایم هم hidden می باشد.و هنگاهی نمایش داده می شود که اندازه ی صفحه ی ما کمتر از 1061px باشد. (یعنی هنگامی که با تغییر دادن اندازه صفحه پنجره ی ما 1061px شود ) علاوه بر اون هم به دکمه ی موردنظر که در هنگام ریسپانسیو شدن نمایش داده می شود هم margin-top:10px و margin-right:10px داده ایم.ما به المان هایی که مقدار خصوصیت آن ها در اینده تغییر می کنه هم transition داده ایم. با این کار ما بین حالت اولیه و حالت نهایی خود از یک transition ظریفی استفاده کرده ایم.
با اعمال تغییرات بالا صفحه ما به شکل زیر در می آید:
Header - تحرک دادن به هدر

تا الان ما یه ساختار ساده ای از چیزی که میخواستیم رو درست کردیم. خب حالا وقتشه که بریم سراغ مرحله ی بعد:
کار اول االمان main دقیقا باید در زیر header قرار بگیرد. به خاطر داشته باشیم که ما به header پوزیشن fix داده بودیم.(position:fixed) ازین رو پوزیشن آن بالای main ما می باشد.
وکار دوماینه کهHeader ما زمانی که به پایین صفحه scroll می کنیم باید حرکت کند.برای حل کردن مسئله اول ما خصوصیت padding-top رو به المان main خود اضافه می کنیم.
مقداری که برای این خصوصیت در نظر می گیریم باید به میزان ارتفاع ای که برای header در نظر گرفته ایم باشه. در این مورد ما ارتفاع به خصوصی رو خب برای header خود در نظر نگرفته ایم بنابراین ما از javascript برای محاسبه آن کمک گرفته و سپس مقدار به دست آمده رو عیناً برای مقدار padding خود قرار می دهیم.
برای حل مسئله دوم خود باید کار های زیر انجام گیرد:
میزانی که صفحه ی ما تا به حال به پایین اسکرول (scroll down) شده رو باز می یابیم.
اگر مقداری که به دست می آید از 150px بیشتر باشد ، ما کلاس scroll را به header خود نسبت می دهیم.

JavaScript – جاوا اسکریپت
کد های جاوا اسکریپتی که ما به آن ها نیاز داریم رو برای شما آماده کرده ایم و شما در تصویر زیر مشاهده می کنید.
ما با معرفی یک سری متغیر ها کار رو شروع کرده ایم ، میزان ارتفاع header رو محاسبه کرده ایم و سپس این مقداری که با کمک جاوا اسکریپت محاسبه کردیم رو به خصوصیت padding-top که برای المان main در نظر گرفته بودیم اضافه می کنیم.
ادامه مطلب http://academyit.net/articles/69
درباره JavaScript ,
منیجر بازدید : 25 سه شنبه 09 مرداد 1397 نظرات (0)
به قطعه کد زیر نگاه کنید : کد: <!DOCTYPE html><html lang="en"><body><script> var cody = { living: true, age: 23, gender: male, getGender: function () { return cody.gender; } }; console.log(cody.getGender()); // Logs male. </script></body></html> حالا به درون تابع getGender نگاه کنید، ما به خاصیت gender از طریق یک نقطه ( cody.gender ) دسترسی پیدا کردیم، میتوانیم از this استفاده کنیم تا به شی cody دسترسی پیدا کنیم به خاطر اینکه this به شی cody اشاره میکند، به قطعه کد زیر توجه کنید : کد: <!DOCTYPE html><html lang="en"><body><script> var cody = { living: true, age: 23, gender: male, getGender: function () { return this.gender; } }; console.log(cody.getGender()); // Logs male. </script></body></html> This در this.gender استفاده شد، در قسمتی که تابع عملیات را انجام میدهد از طریق this به شی cody دسترسی پیدا کردیم، this میتواند پیچیده نیز شود، اما لازم نیست آن را زیاد پیچیده کنید، فقط به یاد داشته باشید، this در درون یک تابع استفاده میشود تا به شی ای که تابع را دربر گرفته است اشاره کند.
کلمه کلیدی this مانند متغیرهای دیگر رفتار میکند با این تفاوت که شما نمیتوانید به صورت عادی آن را مانند متغیرها تغییر بدهید و برخلاف متغیرها که در بین تابع ها به عنوان آرگومان ورودی یا خروجی گرفته یا فرستاده میشوند با this نمیتوانید همچین کاری کنید.Value کلمه کلیدی this چگونه تعیین میشود ؟

Value کلمه کلیدی this بر اساس context تابع ایجاد میشود، خوب دقت کنید زیرا باید خوب به خاطر بسپارید، شی myObject در کد زیر یک خاصیت میدهد به اسم sayFoo که به تابع sayFoo اشاره میکند، زمانی که sayFoo از اسکوپ بالاتر فراخوانی میشود، this به شی window اشاره میکند، زمانی که به عنوان یک متد از myObject فراخوانی میشود، this به myObject اشاره میکند، به کد زیر توجه کنید : کد: <!DOCTYPE html><html lang="en"><body><script> var foo = foo; var myObject = { foo: I am myObject.foo }; var sayFoo = function () { console.log(this[foo]); }; // Give myObject a sayFoo property and have it point to the sayFoo function. myObject.sayFoo = sayFoo; myObject.sayFoo(); // Logs I am myObject.foo. sayFoo(); // Logs foo. </script></body></html> در حقیقت، value کلمه کلیدی this بر اساس context مکانی که تابع در آن فراخوانی میشود مقداردهی میشود، myObject.sayFoo و sayFoo هردو به یک تابع مشخص اشاره میکنند، اما بر اساس اینکه context ئه sayFoo در کجا فراخوانی میشود، value کلمه کلیدی this مقدار دهی میشود.
اگر باعث یادگیری بیشتر شما میشود، این همان کد بالا است با این تفاوت که window نیز به صورت صریح استفاده شده است : کد: <!DOCTYPE html><html lang="en"><body><script> window.foo = foo; window.myObject = { foo: I am myObject.foo }; window.sayFoo = function () { console.log(this.foo); }; window.myObject.sayFoo = window.sayFoo; window.myObject.sayFoo(); window.sayFoo(); </script></body></html> مقدار this بر اساس context تغییر میکند.در تابع های تودرتو (nested) کلمه کلیدی this به شی ابتدایی اشاره میکند !

طریقه عملکر this هنگامی که درون یک تابع است و آن تابع درون یک تابع دیگر است فرق میکند، بر اساس ECMA 3 ، this مسیر خود را از دست میدهد و به شی بالایی اشاره میکند ( شی window در مرورگر ) بجای اینکه به شی تابع اشاره کند.
در قطعه کد زیر، this درون func2 و func3 قرار دارد و مسیر خود را از دست میدهد و به myObject اشاره نمیکند و به شی بالایی یا به اصطلاح فنی شی head اشاره میکند. کد: <!DOCTYPE html><html lang="en"><body><script> var myObject = { func1: function () { console.log(this); // Logs myObject. var func2 = function () { console.log(this) // Logs window, and will do so from this point on. var func3 = function () { console.log(this); // Logs window, as it’s the head object. } (); } (); } } myObject.func1(); </script></body></html> خبر خوب اینکه این مشکل در ECMAScript 5 اصلاح شده است، درحال حاضر باید به این مسئله آگاه باشید و هنگامی که درون توابع مختلف متغیرهای خود را جابجا میکنید طریقه عملکرد آن را بدانید.
قطعه کد زیر را در نظر بگیرید، هنگامی که یک تابع ناشناس را به foo.func1 بفرستیم چه اتفاقی می افتد ؟ زمانی که یک تابع ناشناس درون foo.func1 فراخوانی شود ( یک تابع درون تابع دیگر ) مقدار this درون تابع ناشناس به شی foo اشاره میکند : کد: <!DOCTYPE html><html lang="en"><body><script> var foo = { func1: function (bar) { bar(); // Logs window, not foo. console.log(this); // The this keyword here will be a reference to the foo object. } } foo.func1(function () { console.log(this) }); </script></body></html> هرگز فراموش نکنید : مقدار this همیشه به شی head اشاره میکند زمانی که تابع میزبان توسط یک تابع دیگر محصور شده باشد، یکبار دیگر تکرار میکنم، این عملیات در ECMAScript 5 اصلاح شده است.در اسکوپ های زنجیره ای چه اتفاقی می افتد ؟

به راحتی میتوانید از اسکوپ های زنجیره ای نیز استفاده کنید، بر اساس کد زیر، یک متغیر مانند that داریم، با توجه به کد و کامنت های درون آن داریم : کد: <!DOCTYPE html><html lang="en"><body><script> var myObject = { myProperty: I can see the light, myMethod : function(){ var that = this; // Store a reference to this (myObject) in myMethod scope. var helperFunction = function() { // Child function. // Logs I can see the light via scope chain because that = this. console.log(that.myProperty); // Logs I can see the light. console.log(this); // Logs window object, if we dont use "that". }(); } } myObject.myMethod(); // Invoke myMethod. </script></body></html> کنترل کردن مقدار this توسط ()call یا ()apply

مقدار this به صورت نرمال توسط context تابعی که فراخوانی میشود تعیین میشود، اما توسط ()apply و ()call میتوانید مقدار this را هنگامی که فراخونی میشود به مقادیر مختلفی ارجاع دهید، به صورت فکر کنید که تابع X را فراخوانی میکنیم اما به تابع میگوییم که شی Z را به عنوان مقدار this قرار بده و از این طریق مقدار this را override میکنیم.
در مثال بعدی، یک شی و یک تابع میسازیم، سپس تابع را از طریق call() فراخوانی میکنیم و بنابراین مقدار this درون تابع از myObject به عنوان context استفاده میکند : کد: <!DOCTYPE html><html lang="en"><body><script> var myObject = {}; var myFunction = function (param1, param2) { // Set via call(), this points to myObject when function is invoked. this.foo = param1; this.bar = param2; console.log(this) // Logs Object {foo = foo, bar = bar} }; myFunction.call(myObject, foo, bar); // Invoke function, set this value to myObject. console.log(myObject) // Logs Object {foo = foo, bar = bar} </script></body></html> در مثال قبلی از call() استفاده کردیم اما همچنین میتوانیم از apply() نیز استفاده کنیم، تفاوت بین این دو در تفاوت بین پاس دادن متغیرها در توابع است : کد: <!DOCTYPE html><html lang="en"><body><script> var myObject = {}; var myFunction = function (param1, param2) { // Set via apply(), this points to myObject when function is invoked. this.foo = param1; this.bar = param2; console.log(this) // Logs Object {foo = foo, bar = bar} }; myFunction.apply(myObject, [foo, bar]); // Invoke function, set this value. console.log(myObject) // Logs Object {foo = foo, bar = bar} </script></body></html> استفاده از this درون یک سازنده ( constructor ) تعریف شده توسط کاربر

زمانی که یک تابع توسط new فراخوانی میشود، مقدار this به نمونه ( instance ) اشاره میکند، به بیان دیگر، در تابع constructor میتوانیم از طریق this قبل از اینکه شی ساخته شود به آن دسترسی پیدا کنیم، در این مثال، مقدار this میتواند مانند call() یا apply() تغییر کند. در مثال زیر، یک constructor از تابع person میسازیم و از this استفاده میکنیم تا به شی ای که ساخته ایم اشاره کنیم، زمانی که یک instance از Person ساخته شد، this.name به شی ای که تازه ساخته شد اشاره میکند و خاصیت name را میگیرد : کد: <!DOCTYPE html><html lang="en"><body><script> var Person = function (name) { this.name = name || john doe; // this will refer to the instance created. } var cody = new Person(Cody Lindley); // Create an instance based on the Person constructor. console.log(cody.name); // Logs Cody Lindley. </script></body></html> زمانی که تابع constructor توسط new فراخونی میشود this به شی ای که به صورت پیشفرض باید اشاره کند، اشاره میکند، اگر از new استفاده نمیکردیم، مقدار this به context ای که هنگام فراخوانی Person ایجاد میشد اشاره میکرد، به مثال زیر توجه کنید : کد: <!DOCTYPE html><html lang="en"><body><script> var Person = function (name) { this.name = name || john doe; } var cody = Person(Cody Lindley); // Notice we did not use new. console.log(cody.name); // Undefined. The value is actually set at window.name console.log(window.name); // Logs Cody Lindley. </script></body></html> نتیجه گیری

همیشه یادتان باشد که this به صورت پیشفرض به شی ای که در بالای خود میبیند اشاره میکند، از این طریق میتوانید از اشتباهات نابهنگام در کدهای خود پرهیز کنید.
درباره JavaScript ,
1

تعداد صفحات : 1

موضوعات

  • ارائه دهندگان خدمات پرداخت در محل

  • اسکریپت های فروشگاه ساز

  • بازارچه محصولات و خدمات اینترنتی

  • سفارش طرح گرافیکی ، چاپ و نشر

  • خرید و فروش تبلیغات اینترنتی

  • مباحث و منابع آموزشی

  • مباحث دیگر

  • Colocation

  • فروش سرور مجازی

  • ثبت دامنه و میزبانی وب

  • موتور جستجو ، سئو و بهینه سازی

  • خدمات سئو و بهینه سازی وب سایت

  • فروش دامین

  • وب سرورها

  • معرفی سایت ، فروشگاه ، کانال و...

  • فروش پستی و پرداخت در محل

  • اشتراک گذاری

  • دیگر زبان ها

  • گفتگوی آزاد

  • درگاه های پرداخت

  • درخواست سرویس

  • فروش پنل پیام کوتاه،پیام رسان اجتماعی،تلفن مجازی

  • به دنبال کارمند هستم

  • محصولات نرم افزاری

  • خرید و فروش تلفن های همراه

  • محصولات چند رسانه ای

  • آموزشگاه گرافیک و انیمیشن

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

  • سوالات و مشکلات

  • نیازمند کار یا کارمند هستم

  • درخواست سرور مجازی

  • فروش نمایندگی هاستینگ

  • اسکریپت و قالب سایت

  • مباحث و منابع آموزشي

  • دامنه ، سایت ، گروه و کانال

  • محصولات فرهنگی آموزشی

  • اسکریپت های دیگر

  • به دنبال کار هستم

  • روابط عمومی بازارچه

  • برنامه نویسی

  • تبلیغات اینترنتی و بازاریابی آنلاین

  • کالاهای مصرفی فروشگاه اینترنتی

  • سایر محصولات و کالاها

  • سی پنل CPanel

  • ارائه دهندگان خدمات پرداخت اینترنتی

  • اسکریپت های مدیریت سایت و وبلاگ

  • Wordpress

  • شبکه های ویندوزی

  • سیستم های مدیریت محتوا

  • فروش انواع ماژول،پلاگین،قالب،افزونه،امکانات سفارشی

  • Proxy / Cache / Firewall

  • اوپن وی زد OpenVZ

  • فروش هاست اشتراکی

  • درخواست هاست اشتراکی

  • فروش سرور اختصاصی

  • وی ام ور Vmware

  • بازارچه محصولات سخت افزاری

  • سیسکو Cisco

  • سرویس دهندگان خارجی

  • پنل اس ام اس ، تلگرام و ...

  • نرم افزار

  • PHP-MySQL

  • همکاری در فروش

  • لپ تاپ و لوازم جانبی

  • Joomla-Mambo

  • کار آفرینی و مدیریت کسب و کار

  • اخبار دنیای فناوری

  • محصولات و نجهیزات ورزشی

  • 2

  • فروش انواع وب سایت،گروهای اطلاع رسانی

  • زیور آلات و جواهرات تزئینی

  • کیف ، کفش و پوشاک

  • سئو ، بک لینک و افزایش بازدید

  • فروش نقدی و پرداخت الکترونیک

  • پلاگین طراحی کنید و 200

  • آموزشگاه زبان های برنامه نویسی

  • عینک های طبی و آفتابی

  • مسائل مربوط به انجمن

  • فروش انواع لایسنس

  • وام های بانکی و تسهیلات کم بهره

  • CentOS

  • خدمات طراحی و گرافیکی

  • دايرکت ادمين DirectAdmin

  • درخواست سرور اختصاصی

  • خرید و فروش لوازم جانبی موبایل

  • ssd

  • ubuntu

  • ایده پروری ، ایده یابی و ایده پردازی

  • انجمن خیریه

  • درخواست انواع اسکریپت،سیستم عامل،نرم افزار و ..

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

  • مباحث عمومی مرکز داده

  • بازی های رایانه ای

  • دامین

  • درخواست خدمات برنامه نویسی

  • نماد اعتماد الکترونیکی (اینماد)

  • راه اندازی و مدیریت فروشگاه اینترنتی

  • اثاثیه منزل و لوازم خانگی

  • فروش انواع اسکریپت،سیستم عامل،نرم افزار و ..

  • مباحث و منابع آموزش

  • مباحث و منایع آموزشی

  • کلوکسو يا ال ايکس ادمين Kloxo or LXAdmin

  • اتصالات به اینترنت و ارایه دهندگان پهنای باند

  • vBulletin

  • سرور مجازی

  • تا 70 درصد تخفیف فروش دامین

  • ارائه دهندگان وبلاگ فروشگاهی

  • آرایشی و بهداشتی

  • خدمات برنامه نویسی

  • خدمات کانفیگ سرور و وب سایت

  • درخواست نمایندگی هاستینگ

  • بازارچه خدمات برنامه نویسی

  • درخواست سخت افزار

  • ماژول ، قالب و افزونه ها

  • سرور اختصاصی

  • عطر ، اسپری و ادکلن

  • درخواست انواع ماژول،پلاگین،قالب،امکانات سفارشی

  • فروش سخت افزار

  • PHPNUKE

  • WHMCS

  • زن Xen

  • فروش ویژه شماره مجازی روسیه مخصوص تلگرام

  • شبکه های بی سیم

  • ساير مجازي سازي ها

  • دیگر سیستم ها

  • بازارچه کار و سرمایه

  • نیازمند php

  • هاست اشتراکی

  • تبلت ها و دیوایس های پرتابل

  • HTML-XHTML

  • ساير کنترل پنل ها

  • فروش عیدانه : آفر ویژه ارائه نمایندگی

  • Debian

  • دیجی سرور| فروش ویژه و استثنایی سرور مجازی از اروپا|256 مگابایت رم

  • درخواست توضیحات برای میزان مصرف cpu

  • ASP-ASP.net-Access-MSSQL

  • ارسال ایمیل تبلیغاتی و ایمیل مارکتینگ

  • شارژ خط به خط و کارت شارژ

  • درخواست خدمات کانفیگ سرور و وب سایت

  • درخواست پنل پیام کوتاه،پیام رسان اجتماعی،تلفن مجازی

  • ساعت ، تایمر و شمارنده

  • فیلم های آموزشی

  • ذخیره سازی / SAN /NSA

  • اسکریپت های مدیریت انجمن گفتگو

  • انجمن نظرسنجی

  • سایر لینوکس ها

  • کولرگازی

  • مالیات کسب و کارهای اینترنتی

  • لایک

  • درخواست کالا و خدمات

  • طراحی حرفه ای بنر

  • الگوریتم های روتینگ

  • شرکتهای خصوصی جا به جایی کالا

  • Review دیتا سنترها

  • JavaScript

  • فایروال سخت افزاری

  • بحث در مورد نرم افزار / سخت افزار مرکز داده

  • دو سرور بدون ستاپ هتزنر ex41-ssd

  • درخواست دامین

  • Diablo 3

  • گیاهان آپارتمانی و حیوانات خانگی

  • سایر مجازی سازی ها

  • سامان

  • US

  • پلسک Plesk

  • مدیریت

  • بزرگان

  • اکانتینگ Accounting

  • پلیر ها و پخش کننده ها

  • درخواست انواع وب سایت،گروهای اطلاع رسانی

  • نمایندگی میزبانی وب

  • فروشگاه صنایع دستی

  • سيتريکس Citrix Systems

  • سوالی در مورد فتوشاپ

  • AJAX

  • شبکه های لینوکسی

  • درخواست خدمات Payment Credit card

  • STP(Unshielded Twisted Pair)

  • هايپر وي Microsoft Hyper-V

  • نیروی انسانی

  • info

  • درخواست خدمات طراحی و گرافیکی

  • کردیت کارت ، گیفت کارت و ارز اینترنتی

  • Hard Enterprise

  • [بنـــر20 : طراحـی حرفه ای بنــر

  • ns1

  • یه مشکل در گوگل +1

  • مشکل با تمامی ماژول ها

  • صفحه اول گوگل و bing.com

  • 29IPs

  • سخت افزار

  • سیستم های بک آپ و بازیابی اطلاعات

  • trace

  • به مناسبت عيد سعيد فطر - ارائه درگاه پرداخت اختصاصی سامان

  • کارکرد عالی

  • ایندکس گوگل

  • onda

  • رفع خطای اتصال Remote به سرور MS SQL 2008 - Microsoft SQL Server

  • ساير لينوکس ها

  • %25 تخفیف دانشجویی

  • .info

  • KIMSUFI

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

  • فروش سرور مجازی آمریکا با قیمت ویژه ( دائمی ) 512 =9

  • آموزش (10) mcsa

  • هايپر وي ام HyperVM

  • فروشگاه تبلیغاتی لونو

  • فروش دامنه های tp24

  • کلاسترینگ و محاسبات ابری

  • فروش ویژه اینترنت پرسرعت +adsl2 آسیاتک در سراسر کشور + 15

  • درخواست خدمات سئو و بهینه سازی وب سایت

  • پذیرش نمایندگی فروش هاستینگ

  • آزمون تومر

  • جشنواره اقساطی فروش سرور اختصاصی ex-px هتزنر آلمان با 65٪ تخفیف

  • پشتیبانی

  • PHPBB

  • سرور مجازی ماهانه 7 هزار تومان ، تحویل آنی ، مجازی ساز kvm

  • هاستینگ نامحدود + دامین رایگان + 1 ماه گارانتی بازگشت پول + آپ تایم 99.99 فقط 29

  • آلوما ولت طرح دار

  • پلاگين

  • رپورتاژ

  • خدمات Payment Credit card

  • فروش vps ویندوز با رم 512 مگ وارز ساپورت مناسب دانلود و آپلود فقط 18

  • نیازمند پاکت حباب دار a5
    آمار سایت
  • کل مطالب : 608
  • کل نظرات : 0
  • افراد آنلین : 13
  • تعداد اعضا : 0
  • بازدید امروز : 3,436
  • باردید دیروز : 6,453
  • بازدید هفته : 9,889
  • بازدید ماه : 9,889
  • بازدید سال : 9,889
  • بازدید کلی : 1,416,096