Have an account? Sign in
Login  Register  Facebook
This Page is Under Construction! - If You Want To Help Please Send your CV - Advanced Web Core (BETA)
[Edit] الكائن window.
عرضنا من قبل في درس الكائنات الموجودة مسبقا. مخططا للكائنات الموجودة في الجافا سكريبت و التي تعتمد في عملها عليهم و المخطط كان يقسم الكائنات حسب النوع و الوظيفة فهناك كائنات خاصة بأساس اللغة نفسها Language , ودرسنا منها Math و Date و Array و String .و كائنات خاصة بالمتصفح و محتوياته و التي كانت تحت التصنيف navigator, و من الآن سنبدأ في دراسة هذا الجزء navigator و الذي فهممه هو مفتاح تحكم الجافا سكريبت في محتويات صفحة الويب. سنبدأ بدراسة الكائن window في هذ الدرس و الذي تحدثنا عنه من قبل في درس الكائنات الموجودة مسبقا.و قلنا أن الدوال و المتغيرات التي تقوم بتعرفيها بدون أن تكون داخل دالة أخرى أو كائن تكون عبارة عن دوال methods و خواص للكائن window ,ولا يقف الأمر عند هذا الحد فقط,إن الكائن window يمثل نافذة المتصفح التي تحتوى على الصفحة و كما تحتوى نافذة المتصفح داخلها كل شيء في الموقع فإن الكائن window أيضا هو الكائن الشامل global الذي يتحتوى كل الكائنات الأخرى سواء كانت في في الجزء الأيمن من مخطط الكائنات الموجودة مسبقا.أو على الجانب الأيسر و لتشعر بذلك بنفسك جرب هذا الكود في الـconsole
window.Math.PI
و ستجد أنه يرجع لك قيمة الثابت PI و يتضح من هذا الكود أن Math كأنه يوجد داخل window و كذلك حال كل الكائنات الأخرى,و لأن كل شيء يمكن أن يبدأ بwindow لا تحتاج في أغلب الأحوال لأن تكتبها إلا في حالات نادرة كالموجودة بالمثال التالي:
var myVar = "global variable";
function myFunc() {
var myVar = "scoped variable";
console.log(myVar);
console.log(window.myVar);
}
myFunc();
وإذا وضعت هذا الكود في الكنسول ستجد أن الناتج الذي سيظهر لك

"scoped variable"

"global variable"

و كما ترى في المثال إحتجنا لأن نسبق myVar بـ window لنميز المتغير العام عن المتغير الخاص بالدالة myVar . في كل الكائنات التي درسناها سابقا و التي كانت ضمن النصف الأيمن Language ,دوالها و خصائصها ليس لها علاقة بالمتصفح و محتوياته فمثلا أنت تعرف مصفوفة لعدد من الأرقام ثم يمكنك أن تستخدم concat لتدمج معها مصفوفة أخرى و إلى آخره مما كنا نفعله في هذا النوع من الكائنات .أما الجزء الأيسر و الذي سنبدأ في دراسته دواله و خصائصه تتعلق بالمتصفح و محتويات الصفحه و الشكل التالي يوضح كائناته و سترى أن كلها تتفرع من window لأنه يحتويها جميعا في الدروس السابقة إستخدمنا دوال من الكائن window مثل alert و confirm و prompt و كانت كل هذه الدوال تخرج لك نوافذ و هذا يوضح كيف أن الكائنات الموجودة في هذا الشكل تقوم بالربط بين مكونات لها وجود في المتصفح مثل النافذه و بيانات في لغة الجافا سكريبت الأساسية ,و أيضا تعاملنا مع دالة document.write() والتي أيضا كانت تقوم بطباعة بيانات نصية من اللغة إلى صفحة الويب ,سندرس الكائن document بالتفصيل في الفصل التالي أما الآن فسنأخذ مثالين من الكائنات المتفرعة من window الموجودة بالشكل و هما navigator و location .

navigator

الكائن navigator يمدنا بمعلومات عن المتصفح الذي نستخدمه مثل نوعه و إصداره و نظام التشغيل الذي يعمل عليه و يتم ذلك من خلال عدد من الخواص فيه: لمعرفة إسم المتصفح نستخدم :
navigator.appName
لمعرفة الإصدار نستخدم:
navigator.appVersion
لمعرفة نظام التشغيل نستخدم:
navigator.platform
و يمكنك تجربة هذه الأكواد في الكنسول .

location

يختص بعنوان الصفحة . ولنأخذ مثال على الكائن location لنرى كيف أن تغيير قيمة خاصية يؤدي إلى تغيير شيء في نافذة المتصفح . إليك المثال ,قم بنسخ الكود و ضعه في ملف html و قم بتجربته لأنه لا يصلح لأن تجربه في محرر الأكواد.
<!DOCTYPE html>

<html>
<head>
    <title></title>
</head>
<body>
    <script  type="text/javascript">
  if (confirm("Do you want to go to Google?")) {
    location = "http://www.google.com";
} else {
    location.reload(true);
}
  </script>
</body>
</html>
و عند تجربة الكود سيظهر لك صندوق يسألك Do you want to go to Google? إذا ضغطت ok سترجع دالة confirm القيمة true و بالتالي سينفذ السطر
    location = "http://www.google.com";
و في هذه الحالة ستجد أنه تم فتح موقع جوجل بجعل قيمة location تساوي "http://www.google.com" أما إن قمت بالضغط على cancel فسينفذ السطر :
 location.reload();
و في هذه الحالة سيتم إعادة تحميل الصفحة و سيظهر لك الصندوق ثانية و مفتاح فهم هذا الكود هو أن تعرف أن location كائن يختص بعنوان الصفحة يعطيك معلومات عنه كما أنه تغير قيمته يؤدي إلى تغيير العنوان كما رأيت و له دوال و خواص متعلقة بالعنوان مثل الدالة التي إستخدمناها reload و التي تعيد تحميل العنوان ,و لن نستفيض الآن في شرح الكائن location فالغرض من المثال هو أن يتجسد لك كيف أنه من خلال تغيير بعض القيم بالجافا سكريبت تتغير أشياء في الصفحة و كيف أن الجافا سكريبت تتحكم في صفحات الويب.و في الدرس التالي سنرجع للكائن window نفسه و نستخدم أحد دواله و هي open لنوضح أكتر كيف أن النوافذ يتم التعامل معاها داخل الجافا سكريبت من خلال التعامل مع كائنات.
November 28, 2011