سؤالات مصاحبه استخدامی برنامه نویس جاوا اسکریپت — به همراه جواب
جاوا اسکریپت به عنوان زبان طراحی فرانتاند وب، یکی از محبوبترین زبانهای برنامهنویسی دنیا محسوب میشود. این محبوبیت در سالهای اخیر با معرفی واریانتهای دیگر این زبان از قبیل تایپ اسکریپت و همچنین محیط زمان اجرای Nodejs برای بکاند و همچنین انواع مختلف فریمورکهای فرانتاند دوچندان افزایش یافته است. ما در این مطلب از مقالات برنامهنویسی بلاگ فرادرس تلاش کردهایم راهنمای جامعی از سؤالات مصاحبه استخدامی برنامه نویس جاوا اسکریپت را گرد هم بیاوریم تا به افرادی که علاقهمند به استخدام در چنین مشاغل هستند کمک کرده باشیم، این مصاحبهها را با آمادگی بیشتری سپری کنند.
سوالات عمومی
در این بخش سوالات عمومی مرتبط با مصاحبه استخدامی برنامه نویس جاوا اسکریپت را ارائه میکنیم.
سوال اول: تفاوت بین undefined و not defined در جاوا اسکریپت چیست؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال دوم: برای کدام مقدار x نتیجه گزارههای زیر یکسان نیست؟
1if( x <= 100 ) {...}
2if( !(x > 100) ) {...}
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سوم: عیب اعلان مستقیم متدها در اشیای جاوا اسکریپت چیست؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهارم: منظور از کلوژر در جاوا اسکریپت چیست؟ (مثال بزنید)
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال پنجم: تابعی به نام mul بنویسید که در زمان فراخوانی با ساختار زیر عملکرد صحیحی داشته باشد.
1console.log(mul(2)(3)(4)); // output : 24
2console.log(mul(4)(3)(4)); // output : 48
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال ششم: چطور یک آرایه جاوا اسکریپت را خالی کنیم؟
برای نمونه چطور میتوانیم آرایه زیر را خالی کنیم؟
1var arrayList = ['a', 'b', 'c', 'd', 'e', 'f'];
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفتم: آرایه بودن یا نبودن یک شیء را چگونه بررسی کنیم؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هشتم: خروجی کد زیر چیست؟
1var output = (function(x) {
2 delete x;
3 return x;
4})(0);
5
6console.log(output);
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال نهم: خروجی کد زیر چیست؟
1var x = 1;
2var output = (function() {
3 delete x;
4 return x;
5})();
6
7console.log(output);
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال دهم: خروجی کد زیر چیست؟
1var x = { foo : 1};
2var output = (function() {
3 delete x.foo;
4 return x.foo;
5})();
6
7console.log(output);
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال یازدهم: خروجی کد زیر چیست؟
1var Employee = {
2 company: 'xyz'
3}
4var emp1 = Object.create(Employee);
5delete emp1.company
6console.log(emp1.company);
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال دوازدهم: منظور از undefined x 1 در جاوا اسکریپت چیست؟
1var trees = ["redwood", "bay", "cedar", "oak", "maple"];
2delete trees[3];
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سیزدهم: خروجی کد زیر چیست؟
1var trees = ["xyz", "xxxx", "test", "ryan", "apple"];
2delete trees[3];
3console.log(trees.length);
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهاردهم: خروجی کد زیر چیست؟
1var bar = true;
2console.log(bar + 0);
3console.log(bar + "xyz");
4console.log(bar + true);
5console.log(bar + false);
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال پانزدهم: خروجی کد زیر چیست؟
1var z = 1, y = z = typeof y;
2console.log(y);
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال شانزدهم: خروجی کد زیر چیست؟
1// NFE (Named Function Expression)
2var foo = function bar() { return 12; };
3typeof bar();
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفدهم (الف): تفاوت بین اعلان کردن یک تابع به روشهای زیر کدام است؟
1var foo = function() {
2 // Some code
3}
1function bar () {
2 // Some code
3}
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفدهم (ب): خروجی کد زیر چیست؟
1bar();
2(function abc(){console.log('something')})();
3function bar(){console.log('bar got called')};
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هجدهم: در چه حالتی تعریف تابع در جاوا اسکریپت hoist نمیشود؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال نوزدهم: خروجی کد زیر چه خواهد بود؟
1var salary = "1000$";
2
3(function () {
4 console.log("Original salary was " + salary);
5
6 var salary = "5000$";
7
8 console.log("My New Salary " + salary);
9})();
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال بیستم: تفاوت بین typeof و instanceof چیست؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال بیست و یکم: طول آرایه انجمنی زیر را محاسبه کنید.
1var counterArray = {
2 A : 3,
3 B : 4
4};
5counterArray["C"] = 1;
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال بیست و دوم: تفاوت بین فراخوانی Function, Method و Constructor چیست؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال بیست و سوم: خروجی کد زیر چه میتواند باشد؟
1function User(name) {
2 this.name = name || "JsGeeks";
3}
4
5var person = new User("xyz")["location"] = "USA";
6console.log(person);
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال بیست و چهارم: سرویس ورکرها چه هستند و چه زمان استفاده میشوند؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال بیست و پنجم: تفاوت بین متد و تابع در جاوا اسکریپت چیست؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال بیست و ششم: IIFE چیست و چه فایدهای دارد؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال بیست و هفتم: الگوی سینگلتون را در جاوا اسکریپت توضیح دهید.
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال بیست و هشتم: روشهای مختلف ایجاد اشیا در جاوا اسکریپت کدامند؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال بیست و نهم: تابعی به نام deepClone بنویسید که یک شیء گرفته و کپی آن را بسازد
1var newObject = deepClone(obj);
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سیام: بهترین روش برای تشخیص مشخصه شیء undefined در JS کدام است؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سی و یکم: تابعی به نام Clone بنویسید که شیئی را گرفته و یک کپی از آن را بدون کپی کردن مشخصههای عمیق شیء بسازد.
1 var objectLit = {foo : 'Bar'};
2 var cloneObj = Clone(obj); // Clone is the function which you have to write
3 console.log(cloneObj === Clone(objectLit)); // this should return false
4 console.log(cloneObj == Clone(objectLit)); // this should return true
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سی و دوم: promise چیست و چه فایدهای دارد؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سی و سوم: روش اطمینان از وجود یک کلید در یک شیء جاوا اسکریپت چیست؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سی و چهارم: NaN چیست، چرا به آن نیاز داریم و چطور باعث بروز مشکل در صفحه میشود؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سی و پنجم: باگ کد زیر را تنها با استفاده از ES5 اصلاح کنید
1var arr = [10, 32, 65, 2];
2for (var i = 0; i < arr.length; i++) {
3 setTimeout(function() {
4 console.log('The index of this number is: ' + i);
5 }, 3000);
6}
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سی و ششم: بررسی مقدار یک متغیر در آرایه
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سی و هفتم: بهترین روش برای تشخیص مقدار ارجاعی یک نوع در جاوا اسکریپت کدام است؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سی و هشتم: متد Object.create در جاوا اسکریپت چطور عمل میکند؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال سی و نهم: کاربرد توابع سازنده برای ارثبری چیست؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهلم: چطور از دستکاری اشیا در جاوا اسکریپت ممانعت کنیم؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهل و یکم: تابع لاگ بنویسید که در لاگ کنسول یک عبارت به ابتدای همه پیامها اضافه کند.
برای نمونه اگر میخواهید پیام console.log("Some message") را لاگ کنید، خروجی باید به صورت (your message) Some message باشد.
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهل و دوم: تابعی بنویسید که رشته را به عنوان لفظ یا شیء تست کند.
برای نمونه میتوانیم با استفاده از لفظ رشتهای و یا با استفاده از تابع سازنده رشته یک رشته متنی تولید کنیم.
1 // using string literal
2 var ltrlStr = "Hi I am string literal";
3 // using String constructor function
4 var objStr = new String("Hi I am string object");
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهل و سوم: کاربرد رایج تابع anonymous در جاوا اسکریپت چیست؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهل و چهارم: چطور یک مقدار پیشفرض برای پارامتر تعیین کنیم؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهل و پنجم: کد ادغام دو شیء جاوا اسکریپت به روش دینامیک را بنویسید.
فرض کنید دو شیء مانند زیر دارید:
1var person = {
2 name : 'John',
3 age : 24
4}
5
6var address = {
7 addressLine1 : 'Some Location x',
8 addressLine2 : 'Some Location y',
9 city : 'NewYork'
10}
تابع ادغامی بنویسید که دو شیء را گرفته و مشخصههای شیء دوم را به مشخصههای شیء اول اضافه کند.
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهل و ششم: مشخصه غیر شمارشی در جاوا اسکریپت چیست و چطور میتوان ساخت؟
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهل و هفتم: منظور از «اتصال تابع» (Function binding) چیست؟
پرسشهای کدنویسی
- ارسال مقادیر با ارجاع یا با مقدار؟
درک این که کدام مقادیر باید به شیوه ارجاعی و کدام یک به شیوه مقداری ارسال شوند، برای یک توسعهدهنده جاوا اسکریپت حائز اهمیت بالایی است. به یاد داشته باشید که اشیا شامل آرایهها به صورت ارجاعی ارسال میشوند، در حالی که رشتهها، مقادیر بولی و اعداد به صورت مقداری ارسال میشوند.
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهل و هشتم: خروجی کد زیر چیست؟
1var strA = "hi there";
2var strB = strA;
3strB="bye there!";
4console.log (strA)
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال چهل و نهم: خروجی کد زیر چیست؟
1var objA = {prop1: 42};
2var objB = objA;
3objB.prop1 = 90;
4console.log(objA)
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال پنجاهم: خروجی کد زیر چیست؟
1var objA = {prop1: 42};
2var objB = objA;
3objB = {};
4console.log(objA)
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال پنجاه و یکم: خروجی کد زیر چیست؟
1var arrA = [0,1,2,3,4,5];
2var arrB = arrA;
3arrB[0]=42;
4console.log(arrA)
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال پنجاه و دوم: خروجی کد زیر چیست؟
1var arrA = [0,1,2,3,4,5];
2var arrB = arrA.slice();
3arrB[0]=42;
4console.log(arrA)
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال پنجاه و سوم: خروجی کد زیر چیست؟
1var arrA = [{prop1: "value of array A!!"}, {someProp: "also value of array A!"}, 3,4,5];
2var arrB = arrA;
3arrB[0].prop1=42;
4console.log(arrA);
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال پنجاه و چهارم: خروجی کد زیر چیست؟
1var arrA = [{prop1: "value of array A!!"}, {someProp: "also value of array A!"},3,4,5];
2var arrB = arrA.slice();
3arrB[0].prop1=42;
4arrB[3] = 20;
5console.log(arrA);
- برای مشاهده پاسخ + اینجا کلیک کنید.
پرسشهای Hoisting
سؤال پنجاه و پنجم: نتیجه دستور console.log(employeeId); چیست؟
- Some Value
- Undefined
- Type Error
- ReferenceError: employeeId is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال پنجاه و ششم: خروجی کد زیر چیست؟
1console.log(employeeId);
2var employeeId = '19000';
- Some Value
- undefined
- Type Error
- ReferenceError: employeeId is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال پنجاه و هفتم: خروجی کد زیر چیست؟
1var employeeId = '1234abe';
2(function(){
3 console.log(employeeId);
4 var employeeId = '122345';
5})();
- '122345'
- undefined
- Type Error
- ReferenceError: employeeId is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال پنجاه و هشتم: خروجی کد زیر چیست؟
1var employeeId = '1234abe';
2(function() {
3 console.log(employeeId);
4 var employeeId = '122345';
5 (function() {
6 var employeeId = 'abc1234';
7 }());
8}());
- '122345'
- undefined
- '1234abe'
- ReferenceError: employeeId is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال پنجاه و نهم: خروجی کد زیر چیست؟
1(function() {
2 console.log(typeof displayFunc);
3 var displayFunc = function(){
4 console.log("Hi I am inside displayFunc");
5 }
6}());
- undefined
- function
- 'Hi I am inside displayFunc'
- ReferenceError: displayFunc is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال شصتم: خروجی کد زیر چیست؟
1var employeeId = 'abc123';
2function foo(){
3 employeeId = '123bcd';
4 return;
5}
6foo();
7console.log(employeeId);
- undefined
- '123bcd'
- 'abc123'
- ReferenceError: employeeId is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال شصت و یکم: خروجی کد زیر چیست؟
1var employeeId = 'abc123';
2
3function foo() {
4 employeeId = '123bcd';
5 return;
6
7 function employeeId() {}
8}
9foo();
10console.log(employeeId);
- undefined
- '123bcd'
- 'abc123'
- ReferenceError: employeeId is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال شصت و دوم: خروجی کد زیر چیست؟
1var employeeId = 'abc123';
2
3function foo() {
4 employeeId();
5 return;
6
7 function employeeId() {
8 console.log(typeof employeeId);
9 }
10}
11foo();
- undefined
- function
- string
- ReferenceError: employeeId is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال شصت و سوم: خروجی کد زیر چیست؟
1function foo() {
2 employeeId();
3 var product = 'Car';
4 return;
5
6 function employeeId() {
7 console.log(product);
8 }
9}
10foo();
- undefined
- Type Error
- 'Car'
- ReferenceError: product is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال شصت و چهارم: خروجی کد زیر چیست؟
1(function foo() {
2 bar();
3
4 function bar() {
5 abc();
6 console.log(typeof abc);
7 }
8
9 function abc() {
10 console.log(typeof bar);
11 }
12}());
- undefined undefined
- Type Error
- function function
- ReferenceError: bar is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال شصت و پنجم: خروجی کد زیر چیست؟
1(function() {
2 'use strict';
3
4 var person = {
5 name: 'John'
6 };
7 person.salary = '10000$';
8 person['country'] = 'USA';
9
10 Object.defineProperty(person, 'phoneNo', {
11 value: '8888888888',
12 enumerable: true
13 })
14
15 console.log(Object.keys(person));
16})();
- Type Error
- undefined
- ["name", "salary", "country", "phoneNo"]
- ["name", "salary", "country"]
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال شصت و ششم: خروجی کد زیر چیست؟
1(function() {
2 'use strict';
3
4 var person = {
5 name: 'John'
6 };
7 person.salary = '10000$';
8 person['country'] = 'USA';
9
10 Object.defineProperty(person, 'phoneNo', {
11 value: '8888888888',
12 enumerable: false
13 })
14
15 console.log(Object.keys(person));
16})();
- Type Error
- undefined
- ["name", "salary", "country", "phoneNo"]
- ["name", "salary", "country"]
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال شصت و هفتم: خروجی کد زیر چیست؟
1(function() {
2 var objA = {
3 foo: 'foo',
4 bar: 'bar'
5 };
6 var objB = {
7 foo: 'foo',
8 bar: 'bar'
9 };
10 console.log(objA == objB);
11 console.log(objA === objB);
12}());
- false true
- false false
- true false
- true true
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال شصت و هشتم: خروجی کد زیر چیست؟
1(function() {
2 var objA = new Object({foo: "foo"});
3 var objB = new Object({foo: "foo"});
4 console.log(objA == objB);
5 console.log(objA === objB);
6}());
- false true
- false false
- true false
- true true
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال شصت و نهم: خروجی کد زیر چیست؟
1(function() {
2 var objA = Object.create({
3 foo: 'foo'
4 });
5 var objB = Object.create({
6 foo: 'foo'
7 });
8 console.log(objA == objB);
9 console.log(objA === objB);
10}());
- false true
- false false
- true false
- true true
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفتادم: خروجی کد زیر چیست؟
1(function() {
2 var objA = Object.create({
3 foo: 'foo'
4 });
5 var objB = Object.create(objA);
6 console.log(objA == objB);
7 console.log(objA === objB);
8}());
- false true
- false false
- true false
- true true
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفتاد و یکم: خروجی کد زیر چیست؟
1(function() {
2 var objA = Object.create({
3 foo: 'foo'
4 });
5 var objB = Object.create(objA);
6 console.log(objA.toString() == objB.toString());
7 console.log(objA.toString() === objB.toString());
8}());
- false true
- false false
- true false
- true true
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفتاد و دوم: خروجی کد زیر چیست؟
1(function() {
2 var objA = Object.create({
3 foo: 'foo'
4 });
5 var objB = objA;
6 console.log(objA == objB);
7 console.log(objA === objB);
8 console.log(objA.toString() == objB.toString());
9 console.log(objA.toString() === objB.toString());
10}());
- true true true false
- true false true true
- true true true true
- true true false false
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفتاد و سوم: خروجی کد زیر چیست؟
1(function() {
2 var objA = Object.create({
3 foo: 'foo'
4 });
5 var objB = objA;
6 objB.foo = 'bar';
7 console.log(objA.foo);
8 console.log(objB.foo);
9}());
- foo bar
- bar bar
- foo foo
- bar foo
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفتاد و چهارم: خروجی کد زیر چیست؟
1(function() {
2 var objA = Object.create({
3 foo: 'foo'
4 });
5 var objB = objA;
6 objB.foo = 'bar';
7
8 delete objA.foo;
9 console.log(objA.foo);
10 console.log(objB.foo);
11}());
- foo bar
- bar bar
- foo foo
- bar foo
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفتاد و پنجم: خروجی کد زیر چیست؟
1(function() {
2 var objA = {
3 foo: 'foo'
4 };
5 var objB = objA;
6 objB.foo = 'bar';
7
8 delete objA.foo;
9 console.log(objA.foo);
10 console.log(objB.foo);
11}());
- foo bar
- undefined undefined
- foo foo
- undefined bar
- برای مشاهده پاسخ + اینجا کلیک کنید.
آرایهها
سؤال هفتاد و ششم: خروجی کد زیر چیست؟
1(function() {
2 var array = new Array('100');
3 console.log(array);
4 console.log(array.length);
5}());
- undefined undefined
- [undefined × 100] 100
- ["100"] 1
- ReferenceError: array is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفتاد و هفتم: خروجی کد زیر چیست؟
1(function() {
2 var array1 = [];
3 var array2 = new Array(100);
4 var array3 = new Array(['1',2,'3',4,5.6]);
5 console.log(array1);
6 console.log(array2);
7 console.log(array3);
8 console.log(array3.length);
9}());
- [] [] [Array[5]] 1
- [] [undefined × 100] Array[5] 1
- [] [] ['1',2,'3',4,5.6] 5
- [] [] [Array[5]] 5
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفتاد و هشتم: خروجی کد زیر چیست؟
1(function () {
2 var array = new Array('a', 'b', 'c', 'd', 'e');
3 array[10] = 'f';
4 delete array[10];
5 console.log(array.length);
6}());
- 11
- 5
- 6
- undefined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هفتاد و نهم: خروجی کد زیر چیست؟
1(function(){
2 var animal = ['cow','horse'];
3 animal.push('cat');
4 animal.push('dog','rat','goat');
5 console.log(animal.length);
6})();
- 4
- 5
- 6
- undefined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هشتادم: خروجی کد زیر چیست؟
1(function(){
2 var animal = ['cow','horse'];
3 animal.push('cat');
4 animal.unshift('dog','rat','goat');
5 console.log(animal);
6})();
- ['dog', 'rat', 'goat', 'cow', 'horse', 'cat']
- ['cow', 'horse', 'cat', 'dog', 'rat', 'goat']
- Type Error
- undefined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هشتاد و یکم: خروجی کد زیر چیست؟
1(function(){
2 var array = [1,2,3,4,5];
3 console.log(array.indexOf(2));
4 console.log([{name: 'John'},{name : 'John'}].indexOf({name:'John'}));
5 console.log([[1],[2],[3],[4]].indexOf([3]));
6 console.log("abcdefgh".indexOf('e'));
7})();
- 1 -1 -1 4
- 1 0 -1 4
- 1 -1 -1 -1
- 1 undefined -1 4
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هشتاد و دوم: خروجی کد زیر چیست؟
1(function(){
2 var array = [1,2,3,4,5,1,2,3,4,5,6];
3 console.log(array.indexOf(2));
4 console.log(array.indexOf(2,3));
5 console.log(array.indexOf(2,10));
6})();
- 1 -1 -1
- 1 6 -1
- 1 1 -1
- 1 undefined undefined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هشتاد و سوم: خروجی کد زیر چیست؟
1(function(){
2 var numbers = [2,3,4,8,9,11,13,12,16];
3 var even = numbers.filter(function(element, index){
4 return element % 2 === 0;
5 });
6 console.log(even);
7
8 var containsDivisibleby3 = numbers.some(function(element, index){
9 return element % 3 === 0;
10 });
11
12 console.log(containsDivisibleby3);
13})();
- [2, 4, 8, 12, 16] [0, 3, 0, 0, 9, 0, 12]
- [2, 4, 8, 12, 16] [3, 9, 12]
- [2, 4, 8, 12, 16] true
- [2, 4, 8, 12, 16] false
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هشتاد و چهارم: خروجی کد زیر چیست؟
1(function(){
2 var containers = [2,0,false,"", '12', true];
3 var containers = containers.filter(Boolean);
4 console.log(containers);
5 var containers = containers.filter(Number);
6 console.log(containers);
7 var containers = containers.filter(String);
8 console.log(containers);
9 var containers = containers.filter(Object);
10 console.log(containers);
11})();
- [2, '12', true] [2, '12', true] [2, '12', true] [2, '12', true]
- [false, true] [2] ['12'] []
- [2,0,false,"", '12', true] [2,0,false,"", '12', true] [2,0,false,"", '12', true] [2,0,false,"", '12', true]
- [2, '12', true] [2, '12', true, false] [2, '12', true,false] [2, '12', true,false]
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هشتاد و پنجم: خروجی کد زیر چیست؟
1(function(){
2 var list = ['foo','bar','john','ritz'];
3 console.log(list.slice(1));
4 console.log(list.slice(1,3));
5 console.log(list.slice());
6 console.log(list.slice(2,2));
7 console.log(list);
8})();
- ['bar', 'john', 'ritz'] ['bar', 'john'] ['foo', 'bar', 'john', 'ritz'] [] ['foo', 'bar', 'john', 'ritz']
- ['bar', 'john', 'ritz'] ['bar', 'john','ritz] ['foo', 'bar', 'john', 'ritz'] [] ['foo', 'bar', 'john', 'ritz']
- ['john', 'ritz'] ['bar', 'john'] ['foo', 'bar', 'john', 'ritz'] [] ['foo', 'bar', 'john', 'ritz']
- ['foo'] ['bar', 'john'] ['foo', 'bar', 'john', 'ritz'] [] ['foo', 'bar', 'john', 'ritz']
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هشتاد و ششم: خروجی کد زیر چیست؟
1(function(){
2 var list = ['foo','bar','john'];
3 console.log(list.splice(1));
4 console.log(list.splice(1,2));
5 console.log(list);
6})();
- ['bar', 'john'] [] ['foo']
- ['bar', 'john'] [] ['bar', 'john']
- ['bar', 'john'] ['bar', 'john'] ['bar', 'john']
- ['bar', 'john'] [] []
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هشتاد و هفتم: خروجی کد زیر چیست؟
1(function(){
2 var arrayNumb = [2, 8, 15, 16, 23, 42];
3 arrayNumb.sort();
4 console.log(arrayNumb);
5})();
- [2, 8, 15, 16, 23, 42]
- [42, 23, 26, 15, 8, 2]
- [15, 16, 2, 23, 42, 8]
- [2, 8, 15, 16, 23, 42]
- برای مشاهده پاسخ + اینجا کلیک کنید.
تابعها
سؤال هشتاد و هشتم: خروجی کد زیر چیست؟
1function funcA(){
2 console.log("funcA ", this);
3 (function innerFuncA1(){
4 console.log("innerFunc1", this);
5 (function innerFunA11(){
6 console.log("innerFunA11", this);
7 })();
8 })();
9}
10
11console.log(funcA());
- funcA Window {...} innerFunc1 Window {...} innerFunA11 Window {...}
- undefined
- Type Error
- ReferenceError: this is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال هشتاد و نهم: خروجی کد زیر چیست؟
1var obj = {
2 message: "Hello",
3 innerMessage: !(function() {
4 console.log(this.message);
5 })()
6};
7
8console.log(obj.innerMessage);
- ReferenceError: this.message is not defined
- undefined
- Type Error
- undefined true
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال نودم: خروجی کد زیر چیست؟
1var obj = {
2 message: "Hello",
3 innerMessage: function() {
4 return this.message;
5 }
6};
7
8console.log(obj.innerMessage());
- Hello
- undefined
- Type Error
- ReferenceError: this.message is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال نود و یکم: خروجی کد زیر چیست؟
1var obj = {
2 message: 'Hello',
3 innerMessage: function () {
4 (function () {
5 console.log(this.message);
6 }());
7 }
8};
9console.log(obj.innerMessage());
- Type Error
- Hello
- undefined
- ReferenceError: this.message is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال نود و دوم: خروجی کد زیر چیست؟
1var obj = {
2 message: 'Hello',
3 innerMessage: function () {
4 var self = this;
5 (function () {
6 console.log(self.message);
7 }());
8 }
9};
10console.log(obj.innerMessage());
- Type Error
- 'Hello'
- undefined
- ReferenceError: self.message is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال نود و سوم: خروجی کد زیر چیست؟
1function myFunc(){
2 console.log(this.message);
3}
4myFunc.message = "Hi John";
5
6console.log(myFunc());
- Type Error
- 'Hi John'
- undefined
- ReferenceError: this.message is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال نود و چهارم: خروجی کد زیر چیست؟
1function myFunc(){
2 console.log(myFunc.message);
3}
4myFunc.message = "Hi John";
5
6console.log(myFunc());
- Type Error
- 'Hi John'
- undefined
- ReferenceError: this.message is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال نود و پنجم: خروجی کد زیر چیست؟
1function myFunc() {
2 myFunc.message = 'Hi John';
3 console.log(myFunc.message);
4}
5console.log(myFunc());
- Type Error
- 'Hi John'
- undefined
- ReferenceError: this.message is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال نود و ششم: خروجی کد زیر چیست؟
1function myFunc(param1,param2) {
2 console.log(myFunc.length);
3}
4console.log(myFunc());
5console.log(myFunc("a","b"));
6console.log(myFunc("a","b","c","d"));
- 2 2 2
- 0 2 4
- undefined
- ReferenceError
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال نود و هفتم: خروجی کد زیر چیست؟
1function myFunc() {
2 console.log(arguments.length);
3}
4console.log(myFunc());
5console.log(myFunc("a","b"));
6console.log(myFunc("a","b","c","d"));
- 2 2 2
- 0 2 4
- undefined
- ReferenceError
- برای مشاهده پاسخ + اینجا کلیک کنید.
شیءگرایی
سؤال نود و هشتم: خروجی کد زیر چیست؟
1function Person(name, age){
2 this.name = name || "John";
3 this.age = age || 24;
4 this.displayName = function(){
5 console.log(this.name);
6 }
7}
8
9Person.name = "John";
10Person.displayName = function(){
11 console.log(this.name);
12}
13
14var person1 = new Person('John');
15 person1.displayName();
16 Person.displayName();
- John Person
- John John
- John undefined
- John John
- برای مشاهده پاسخ + اینجا کلیک کنید.
دامنهها
سؤال نود و نهم: خروجی کد زیر چیست؟
1function passWordMngr() {
2 var password = '12345678';
3 this.userName = 'John';
4 return {
5 pwd: password
6 };
7}
8// Block End
9var userInfo = passWordMngr();
10console.log(userInfo.pwd);
11console.log(userInfo.userName);
- 12345678 Window
- 12345678 John
- 12345678 undefined
- undefined undefined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صدم: خروجی کد زیر چیست؟
1var employeeId = 'aq123';
2function Employee() {
3 this.employeeId = 'bq1uy';
4}
5console.log(Employee.employeeId);
- Reference Error
- aq123
- bq1uy
- undefined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و یکم: خروجی کد زیر چیست؟
1var employeeId = 'aq123';
2
3function Employee() {
4 this.employeeId = 'bq1uy';
5}
6console.log(new Employee().employeeId);
7Employee.prototype.employeeId = 'kj182';
8Employee.prototype.JobId = '1BJKSJ';
9console.log(new Employee().JobId);
10console.log(new Employee().employeeId);
- bq1uy 1BJKSJ bq1uy undefined
- bq1uy 1BJKSJ bq1uy
- bq1uy 1BJKSJ kj182
- undefined 1BJKSJ kj182
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و دوم: خروجی کد زیر چیست؟
1var employeeId = 'aq123';
2(function Employee() {
3 try {
4 throw 'foo123';
5 } catch (employeeId) {
6 console.log(employeeId);
7 }
8 console.log(employeeId);
9}());
- foo123 aq123
- foo123 foo123
- aq123 aq123
- foo123 undefined
- برای مشاهده پاسخ + اینجا کلیک کنید.
Call, Apply, Bind
سؤال صد و سوم: خروجی کد زیر چیست؟
1(function() {
2 var greet = 'Hello World';
3 var toGreet = [].filter.call(greet, function(element, index) {
4 return index > 5;
5 });
6 console.log(toGreet);
7}());
- Hello World
- undefined
- World
- ['W', 'o', 'r', 'l', 'd']
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و چهارم: خروجی کد زیر چیست؟
1(function() {
2 var fooAccount = {
3 name: 'John',
4 amount: 4000,
5 deductAmount: function(amount) {
6 this.amount -= amount;
7 return 'Total amount left in account: ' + this.amount;
8 }
9 };
10 var barAccount = {
11 name: 'John',
12 amount: 6000
13 };
14 var withdrawAmountBy = function(totalAmount) {
15 return fooAccount.deductAmount.bind(barAccount, totalAmount);
16 };
17 console.log(withdrawAmountBy(400)());
18 console.log(withdrawAmountBy(300)());
19}());
- Total amount left in account: 5600 Total amount left in account: 5300
- undefined undefined
- Total amount left in account: 3600 Total amount left in account: 3300
- Total amount left in account: 5600 Total amount left in account: 5600
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و پنجم: خروجی کد زیر چیست؟
1(function() {
2 var fooAccount = {
3 name: 'John',
4 amount: 4000,
5 deductAmount: function(amount) {
6 this.amount -= amount;
7 return this.amount;
8 }
9 };
10 var barAccount = {
11 name: 'John',
12 amount: 6000
13 };
14 var withdrawAmountBy = function(totalAmount) {
15 return fooAccount.deductAmount.apply(barAccount, [totalAmount]);
16 };
17 console.log(withdrawAmountBy(400));
18 console.log(withdrawAmountBy(300));
19 console.log(withdrawAmountBy(200));
20}());
- 5600 5300 5100
- 3600 3300 3100
- 5600 3300 5100
- undefined undefined undefined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و ششم: خروجی کد زیر چیست؟
1(function() {
2 var fooAccount = {
3 name: 'John',
4 amount: 6000,
5 deductAmount: function(amount) {
6 this.amount -= amount;
7 return this.amount;
8 }
9 };
10 var barAccount = {
11 name: 'John',
12 amount: 4000
13 };
14 var withdrawAmountBy = function(totalAmount) {
15 return fooAccount.deductAmount.call(barAccount, totalAmount);
16 };
17 console.log(withdrawAmountBy(400));
18 console.log(withdrawAmountBy(300));
19 console.log(withdrawAmountBy(200));
20}());
- 5600 5300 5100
- 3600 3300 3100
- 5600 3300 5100
- undefined undefined undefined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و هفتم: خروجی کد زیر چیست؟
1(function greetNewCustomer() {
2 console.log('Hello ' + this.name);
3}.bind({
4 name: 'John'
5})());
- Hello John
- Reference Error
- Window
- undefined
- برای مشاهده پاسخ + اینجا کلیک کنید.
Callback Functions
سؤال صد و هشتم: خروجی کد زیر چیست؟
1function getDataFromServer(apiUrl){
2 var name = "John";
3 return {
4 then : function(fn){
5 fn(name);
6 }
7 }
8}
9
10getDataFromServer('www.google.com').then(function(name){
11 console.log(name);
12});
13
- John
- undefined
- Reference Error
- fn is not defined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و نهم: خروجی کد زیر چیست؟
1(function(){
2 var arrayNumb = [2, 8, 15, 16, 23, 42];
3 Array.prototype.sort = function(a,b){
4 return a - b;
5 };
6 arrayNumb.sort();
7 console.log(arrayNumb);
8})();
9
10(function(){
11 var numberArray = [2, 8, 15, 16, 23, 42];
12 numberArray.sort(function(a,b){
13 if(a == b){
14 return 0;
15 }else{
16 return a < b ? -1 : 1;
17 }
18 });
19 console.log(numberArray);
20})();
21
22(function(){
23 var numberArray = [2, 8, 15, 16, 23, 42];
24 numberArray.sort(function(a,b){
25 return a-b;
26 });
27 console.log(numberArray);
28})();
- [2, 8, 15, 16, 23, 42] [2, 8, 15, 16, 23, 42] [2, 8, 15, 16, 23, 42]
- undefined undefined undefined
- [42, 23, 16, 15, 8, 2] [42, 23, 16, 15, 8, 2] [42, 23, 16, 15, 8, 2]
- Reference Error
- برای مشاهده پاسخ + اینجا کلیک کنید.
گزارههای Return
سؤال صد و دهم: خروجی کد زیر چیست؟
1(function(){
2 function sayHello(){
3 var name = "Hi John";
4 return
5 {
6 fullName: name
7 }
8 }
9 console.log(sayHello().fullName);
10})();
- Hi John
- undefined
- Reference Error
- Uncaught TypeError: Cannot read property 'fullName' of undefined
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و یازدهم: خروجی کد زیر چیست؟
1function getNumber(){
2 return (2,4,5);
3}
4
5var numb = getNumber();
6console.log(numb);
- 5
- undefined
- 2
- (2,4,5)
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و دوازدهم: خروجی کد زیر چیست؟
1function getNumber(){
2 return;
3}
4
5var numb = getNumber();
6console.log(numb);
- null
- undefined
- ""
- 0
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و سیزدهم: خروجی کد زیر چیست؟
1function mul(x){
2 return function(y){
3 return [x*y, function(z){
4 return x*y + z;
5 }];
6 }
7}
8
9console.log(mul(2)(3)[0]);
10console.log(mul(2)(3)[1](4));
- 6, 10
- undefined undefined
- Reference Error
- 10, 6
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و چهاردهم: خروجی کد زیر چیست؟
1function mul(x) {
2 return function(y) {
3 return {
4 result: x * y,
5 sum: function(z) {
6 return x * y + z;
7 }
8 };
9 };
10}
11console.log(mul(2)(3).result);
12console.log(mul(2)(3).sum(4));
- 6, 10
- undefined undefined
- Reference Error
- 10, 6
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و پانزدهم: خروجی کد زیر چیست؟
1function mul(x) {
2 return function(y) {
3 return function(z) {
4 return function(w) {
5 return function(p) {
6 return x * y * z * w * p;
7 };
8 };
9 };
10 };
11}
12console.log(mul(2)(3)(4)(5)(6));
- 720
- undefined
- Reference Error
- Type Error
- برای مشاهده پاسخ + اینجا کلیک کنید.
سؤال صد و شانزدهم: خروجی کد زیر چیست؟
1function getName1(){
2 console.log(this.name);
3}
4
5Object.prototype.getName2 = () =>{
6 console.log(this.name)
7}
8
9let personObj = {
10 name:"Tony",
11 print:getName1
12}
13
14personObj.print();
15personObj.getName2();
- undefined undefined
- Tony undefined
- undefined Tony
- Tony Tony
- برای مشاهده پاسخ + اینجا کلیک کنید.
پاسخ سوالات
پاسخ سوال اول
در زبان برنامهنویسی جاوا اسکریپت اگر بخواهید از متغیرهایی استفاده کنید که وجود ندارند و اعلان هم نشدهاند، جاوا اسکریپت خطایی به صورت زیر صادر میکند:
var name is not defined
و در ادامه اجرای اسکریپت متوقف میشود. اما اگر از نوع متغیر undeclared_variable استفاده کرده باشید، مقدار undefined بازگشت مییابد.
پیش از ادامه بحث باید تفاوت بین تعریف کردن (Define) و اعلان کردن (Declare) یک متغیر را به خوبی درک کنیم.
عبارت var x یک اعلان است، زیرا تعریف نمیکند که متغیر چه مقداری را باید بگیرد، بلکه ما فقط وجود متغیر و نیاز به تخصیص حافظه را اعلان میکنیم.
1var x; // declaring x
2console.log(x); // output: undefined
از سوی دیگر عبارت var x = 1 هم اعلان و هم تعریف کردن یک متغیر است چون اینجا هر دو کار اعلان کردن و انتساب مقدار برای متغیر x در یک خط انجام یافته است. این کار به طور کلی «مقداردهی» (initialisation) نامیده میشود. در زبان جاوا اسکریپت هم اعلان متغیر و هم اعلان تابع در ابتدای دامنهای که قرار است اعلان صورت گیرد انجام مییابد و سپس انتساب صورت میگیرد. این سری وقایع به نام «برافرازی» (hoisting) شناخته میشوند.
متغیر میتواند اعلان شده باشد، اما تعریف نشده باشد. زمانی که تلاش کنیم به چنین متغیری دسترسی یابیم، نتیجه کار undefined خواهد بود.
1var x; // Declaration
2typeof x === 'undefined'; // Will return true
متغیر میتواند نه اعلان و نه تعریف شده باشد. در چنین حالتی اگر تلاش کنیم به چنین متغیری ارجاع بدهیم، نتیجه not defined خواهد بود.
console.log(y);// Output: ReferenceError: y is not defined
- برای مشاهده روی سوال + اینجا کلیک کنید.
پاسخ سؤال دوم
NaN <= 100 مقدار false دارد و NaN > 100 هم مقدار false دارد، از این رو اگر مقدار x به صورت NaN باشد، گزارهها یکسان نخواهند بود. همین وضعیت برای هر مقدار x که وقتی به نوع «عددی» (Number) تبدیل شده باشد مقدار NaN بازگشت بدهد، نیز صحیح است. برای نمونه میتوان به undefined, [1,2,5], {a:22} و غیره اشاره کرد.
به همین دلیل است که باید در زمان کار با متغیرهای عددی توجه ویژهای مبذول دارید. NaN نمیتواند با هیچ مقدار عددی دیگری برابر باشد یا از آنها کوچکتر یا بزرگتر محاسبه شود. از این رو تنها روش مطمئن برای بررسی این که آیا یک مقدار NaN است یا نه، این است که از تابع ()isNaN استفاده کنیم.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سوم
یکی از معایب اعلان متدها به صورت مستقیم درون اشیای جاوا اسکریپت آن است که از نظر حافظه بسیار غیر بهینه است. با انجام این کار یک کپی جدید از متد برای هر وهله از یک شیء ایجاد میشود. به مثال زیر توجه کنید:
1var Employee = function (name, company, salary) {
2 this.name = name || "";
3 this.company = company || "";
4 this.salary = salary || 5000;
5
6 // We can create a method like this:
7 this.formatSalary = function () {
8 return "$ " + this.salary;
9 };
10};
11
12// Alternatively we can add the method to Employee's prototype:
13Employee.prototype.formatSalary2 = function() {
14 return "$ " + this.salary;
15}
16
17//creating objects
18var emp1 = new Employee('Yuri Garagin', 'Company 1', 1000000);
19var emp2 = new Employee('Dinesh Gupta', 'Company 2', 1039999);
20var emp3 = new Employee('Erich Fromm', 'Company 3', 1299483);
در این حالت، هر وهله از متغیر یعنی emp1, emp2, emp3 کپی خاص خود را از متد theformatSalary دارند. با این حال متد formatSalary2 تنها یک بار به Employee.prototype اضافه خواهد شد.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال چهارم
«کلوژر» (closure) تابعی است که درون تابع دیگری (تابع والد نامیده میشود) تعریف میشود و از این رو به متغیرهای اعلان و تعریف شده درون دامنه تابع والدش دسترسی دارد.
کلوژر به متغیرهای سه دامنه به شرح زیر دسترسی دارد:
- متغیرهای اعلان شده در دامنه خودش.
- متغیرهای اعلان شده در دامنه تابع والدش.
- متغیرهای اعلان شده در فضای نام عمومی.
1var globalVar = "abc"; //Global variable
2
3// Parent self-invoking function
4(function outerFunction (outerArg) { // start of outerFunction's scope
5
6 var outerFuncVar = 'x'; // Variable declared in outerFunction's function scope
7
8 // Closure self-invoking function
9 (function innerFunction (innerArg) { // start of innerFunction's scope
10
11 var innerFuncVar = "y"; // variable declared in innerFunction's function scope
12 console.log(
13 "outerArg = " + outerArg + "\n" +
14 "outerFuncVar = " + outerFuncVar + "\n" +
15 "innerArg = " + innerArg + "\n" +
16 "innerFuncVar = " + innerFuncVar + "\n" +
17 "globalVar = " + globalVar);
18
19 // end of innerFunction's scope
20
21 })(5); // Pass 5 as parameter to our Closure
22
23// end of outerFunction's scope
24
25})(7); // Pass 7 as parameter to the Parent function
در کد فوق innerFunction یک کلوژر است که درون outerFunction تعریف شده است و از این رو به همه متغیرهایی که درون دامنه outerFunction's اعلان و تعریف شدهاند و همچنین به هر متغیری که درون دامنه عمومی برنامه قرار دارد، دسترسی پیدا میکند.
خروجی کد فوق چنین خواهد بود:
outerArg = 7 uterFuncVar = x innerArg = 5 innerFuncVar = y globalVar = abc
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پنجم
1function mul (x) {
2 return function (y) { // anonymous function
3 return function (z) { // anonymous function
4 return x * y * z;
5 };
6 };
7}
در کد فوق تابع mul آرگومان نخست را پذیرفته و یک تابع ناشناس بازگشت میدهد که پارامتر دوم را میگیرد و تابع ناشناس آخر را بازگشت میدهد که در نهایت پارامتر سوم و نهایی را میگیرد. در ادامه تابع آخر x و y و z را صرب در هم کرده و نتیجه عملیات را بازگشت میدهد.
در جاوا اسکریپت، تابعی که درون تابع دیگر تعریف شده باشد، به دامنه تابع بیرونی دسترسی دارد و در نتیجه میتواند متغیرهای متعلق به تابع والدش را بازگشت دهد، دستکاری کند و یا آنها را به تابع دیگری ارسال کند.
- تابع وهلهای از نوع Object است.
- تابع میتواند مشخصه داشته باشد و یک پیوند به متد سازندهاش دارد.
- تابع میتواند به صورت متغیر ذخیره شود.
- تابع میتواند به شکل پارامتر به تابع دیگر ارسال شود.
- تابع میتواند از سوی تابع دیگری بازگشت یابد.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال ششم
چندین روش برای خالی کردن آرایههای جاوا اسکریپت وجود دارند. در ادامه این روشها را بررسی میکنیم.
روش اول
1arrayList = [];
کد فوق متغیر را به صورت یک آرایه جدید خالی تعیین میکند. در صورتی ک به آرایه اصلی از هیچ کجا ارجاع نداشته باشد این روش توصیه میشود، زیرا در عمل یک آرایه جدید خالی ایجاد میکند. توجه کنید که استفاده از این روش نیازمند احتیاط زیادی است، زیرا اگر این ارائه در متغیر دیگری مورد ارجاع قرار گرفته باشد، آرایه مورد ارجاع اصلی بدون تغییر میماند. بنابراین تنها در صورتی باید از این روش استفاده کنید که تنها در متغیر اصلی arrayList آرایه را مورد ارجاع قرار داده باشید.
به مثال زیر توجه کنید:
1var arrayList = ['a', 'b', 'c', 'd', 'e', 'f']; // Created array
2var anotherArrayList = arrayList; // Referenced arrayList by another variable
3arrayList = []; // Empty the array
4console.log(anotherArrayList); // Output ['a', 'b', 'c', 'd', 'e', 'f']
روش دوم
1arrayList.length = 0;
کد فوق آرایه موجود را با تعیین مقدار صفر برای طول آن پاک میکند. این روش خالی کردن آرایه نیز موجب میشود که همه متغیرهای ارجاع داده به آرایه اصلی بهروزرسانی شوند. به مثال زیر توجه کنید:
1var arrayList = ['a', 'b', 'c', 'd', 'e', 'f']; // Created array
2var anotherArrayList = arrayList; // Referenced arrayList by another variable
3arrayList.length = 0; // Empty the array by setting length to 0
4console.log(anotherArrayList); // Output []
روش سوم
1arrayList.splice(0, arrayList.length);
پیادهسازی فوق نیز به خوبی کار خواهد کرد. این روش پاک کردن آرایه موجب بهروز شدن همه ارجاعها به آرایه اصلی میشود.
1var arrayList = ['a', 'b', 'c', 'd', 'e', 'f']; // Created array
2var anotherArrayList = arrayList; // Referenced arrayList by another variable
3arrayList.splice(0, arrayList.length); // Empty the array by setting length to 0
4console.log(anotherArrayList); // Output []
روش چهارم
1while(arrayList.length) {
2 arrayList.pop();
3}
پیادهسازی فوق نیز میتواند آرایه را خالی کند. اما استفاده از آن چندان توصیه نمیشود.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفتم
بهترین روش برای فهمیدن این که یک شیء وهلهای از یک کلاس خاص است یا نه، استفاده از متد toString از Object.prototype است.
1var arrayList = [1, 2, 3];
یکی از بهترین موارد کاربرد بررسی نوع یک شیء، زمانی است که اقدام به اورلود کردن متد در جاوا اسکریپت کردهایم. برای درک این موضوع فرض کنید متدی به نام greet داریم که میتواند یک رشته منفرد و همچنین لیستی از رشتهها را دریافت کند. برای این که متد greet قابل استفاده در هر موقعیت باشد باید بدانیم که کدام پارامتر ارسال شده است، یعنی یک پارامتر منفرد است یا لیستی از مقادیر.
1function greet(param) {
2 if() {
3 // here have to check whether param is array or not
4 }
5 else {
6 }
7}
با این حال، در پیادهسازی فوق ممکن است نیاز به بررسی نوع آرایه داشته باشیم. به این ترتیب میتوانیم وجود یک مقدار رشتهای منفرد را بررسی کرده و کد منطق آرایه را در بلوک else قرار دهیم که در نهایت ما را به قطعه کد زیر میرساند:
1 function greet(param) {
2 if(typeof param === 'string') {
3 }
4 else {
5 // If param is of type array then this block of code would execute
6 }
7 }
اکنون مشکلی با پیگیری دو پیادهسازی قبلی نداریم، اما وقتی موقعیتی داشته باشیم که پارامترها به انواع single value, array و object باشند، با مشکل مواجه خواهیم شد.
اکنون اگر بخواهیم نوع آبجکت را نیز بررسی کنیم، میتوانیم از Object.prototype.toString استفاده کنیم.
1if(Object.prototype.toString.call(arrayList) === '[object Array]') {
2 console.log('Array!');
3}
اگر از jQuery استفاده میکنید، میتوانید از متد isArray در جیکوئری نیز بهره بگیرید:
1if($.isArray(arrayList)) {
2 console.log('Array');
3} else {
4 console.log('Not an array');
5}
باید بدانید که جیکوئری به طور داخلی از Object.prototype.toString.call برای بررسی آبجکت بودن یک آرایه استفاده میکند. در یک مرورگر مدرن میتوان از کد زیر نیز استفاده کرد:
1Array.isArray(arrayList);
Array.isArray از سوی کروم 5، فایرفاکس 4، اینترنت اکسپلورر 9، اپرا 10.5 و سافاری 5 پشتیبانی میشود.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هشتم
کد فوق مقدار 0 را خروجی میدهد. عملگر delete برای حذف یک مشخصه از آبجکت مورد استفاده قرار میگیرد. در کد فوق x یک شیء نیست بلکه یک متغیر لوکال است. عملگر delete روی متغیرهای لوکال تأثیری ندارد.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نهم
کد فوق مقدار 1 را در خروجی ارائه میکند. عملگر delete برای حذف مشخصه از آبجکت استفاده شده است. به این ترتیب x نه یک شیء بلکه یک متغیر سراسری از نوع number است.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال دهم
کد فوق مقدار undefined را در خروجی ارائه میکند. عملگر delete برای حذف یک مشخصه از آبجکت استفاده میشود. در این کد x یک شیء است که مشخصهای به نام foo دارد و یک تابع خود-احضار را شکل داده. ما پس از حذف مشخصه foo از شیء x تلاش میکنیم تا به مشخصه foo ارجاع بدهیم که نتیجه آن undefined است.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال یازدهم
کد فوق مقدار xyz را در خروجی ارائه میکند. در این کد شیء emp1 مشخصه company را به عنوان مشخصه پروتوتایپ دریافت میکند. عملگر delete مشخصه پروتوتایپ را حذف نمیکند.
شیء emp1 مقدار company را به عنوان مشخصه خودش ندارد. اگر میخواهید این موضوع را تست کنید، کد زیر را اجرا نمایید:
console.log(emp1.hasOwnProperty('company')); //output: false
با این حال میتوانیم مشخصه company را به طور مستقیم با استفاده از delete Employee.company از شیء Employee حذف کنیم یا این که میتوانیم با بهرهگیری از مشخصه __proto__ و دستور delete emp1.__proto__.company از شیء emp1 حذف کنیم.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال دوازدهم
هنگامی که کد فوق را اجرا کرده و در کنسول توسعهدهندگان مرورگر کروم دستور console.log(trees); را اجرا کنید، مقدار زیر را به دست میآورید:
["redwood", "bay", "cedar", undefined × 1, "maple"]
در نسخههای جدیدتر کروم یکی از کلمههای empty یا undefined x 1 را ملاحظه میکنید. زمانی که همین کد را در مرورگر فایرفاکس اجرا کنید مقدار زیر را به دست میآورید:
["redwood", "bay", "cedar", undefined, "maple"]
بدیهی است که کروم روش خاص خود را برای نمایش اندیس مقداردهی نشده در آرایهها دارد. با این حال هنگامی که trees[3] === undefined را در هر مرورگری بررسی کنید، خروجی مشابه true را دریافت خواهید کرد.
نکته: به خاطر داشته باشید که لزومی به بررسی اندیس مقداردهی نشده در آرایه در trees[3] === 'undefined × 1' وجود ندارد، زیرا خطایی نمایش نمییابد و 'undefined × 1' تنها روشی برای نمایش اندیس مقداردهی نشده در کروم محسوب میشود.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سیزدهم
کد فوق مقدار 5 را به عنوان خروجی ارائه میکند. زمانی که از عملگر delete برای حذف کردن عناصر یک آرایه بهره بگیریم، طول آرایه تحت تأثیر قرار نمیگیرد. حتی در صورتی که همه عناصر یک آرایه را با استفاده از عملگر delete حذف کنید، طول آن هیچ تأثیری نمیگیرد.
بنابراین زمانی که عملگر delete یک عنصر آرایه را حذف میکند، آن عنصر حذف شده دیگر در آرایه وجود نخواهد داشت. به جای اندیس حذف شده، مقدار undefined x 1 در مرورگر chrome و undefined در اندیس جای میگیرد. در این زمان اگر دستور undefined x 1 in chrome and undefined is را اجرا کنید، خروجی کروم چنین خواهد بود:
["xyz", "xxxx", "test", undefined × 1, "apple"]
خروجی فایرفاکس نیز چنین خواهد بود:
["xyz", "xxxx", "test", undefined, "apple"]
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سوال چهاردهم
کد فوق مقدار 1, "truexyz", 2, 1 را در خروجی ارائه میکند. راهنمای کلی عملگر بعلاوه چنین است:
- عدد + عدد = جمع
- مقدار بولی + عدد = جمع
- مقدار بولی + مقدار بولی = جمع
- عدد + رشته = الحاق
- رشته + مقدار بولی = الحاق
- رشته + رشته = الحاق
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پانزدهم
کد فوق رشته undefined را در خروجی چاپ میکند. بر اساس قاعده شرکتپذیری، عملگرهای دارای تقدم یکسان بر اساس خصوصیت شرکتپذیری عملگر پردازش میشوند. در این مثال شرکتپذیری عملگر انتساب از راست به چپ است و از این رو typeof y ابتدا ارزیابی میشود که رشته undefined است و به z انتساب مییابد و سپس y به مقدار z انتساب مییابد. دنباله کلی به صورت زیر است:
1var z;
2z = 1;
3var y;
4z = typeof y;
5y = z;
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال شانزدهم
خروجی این کد به صورت Reference Error است. برای حل این باگ باید کد را به روش اندکی متفاوت بازنویسی کنیم:
مثال اول
1var bar = function() { return 12; };
2typeof bar();
یا به روش زیر عمل میکنیم:
مثال دوم
1function bar() { return 12; };
2typeof bar();
تعریف تابع میتواند تنها یک متغیر ارجاعی به صورت نام تابع داشته باشد. در مثال اول bar یک متغیر ارجاعی است که به anonymous function اشاره دارد و در مثال دوم یک انتساب تابع داریم و bar نام تابع است.
1var foo = function bar() {
2 // foo is visible here
3 // bar is visible here
4 console.log(typeof bar()); // Works here :)
5};
6// foo is visible here
7// bar is undefined here
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفدهم (الف)
تفاوت اصلی در این است که تابع foo در زمان اجرا (runtime) تعریف شده و یک «عبارت تابعی» (function expression) نامیده میشود، در حالی که تابع bar در زمان parse تعریف شده و «گزاره تابعی» (function statement) نامیده میشود. برای درک بهتر آن نگاهی به کد زیر بیندازید:
1// Run-Time function declaration
2 foo(); // Call foo function here, It will give an error
3 var foo = function() {
4 console.log("Hi I am inside Foo");
5 };
1// Parse-Time function declaration
2bar(); // Call bar function here, It will not give an Error
3function bar() {
4 console.log("Hi I am inside Foo");
5}
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفدهم (ب)
خروجی کد فوق چنین است:
bar got called something
از آنجا که تابع ابتدا فراخوانی میشود و در زمان parse تعریف میشود، موتور جاوا اسکریپت تلاش میکند تا تعاریف زمان parse را یافته و حلقه اجرا را آغاز کند. معنای این حرف آن است که تابع اصلی ابتدا فراخوانی میشود، هر چند تعریف در تابع دیگری ارسال شده باشد.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هجدهم
عبارت تابعی را در نظر بگیرید:
1 var foo = function foo() {
2 return 12;
3 }
در جاوا اسکریپت متغیرهای اعلان شده با var و تابعها به صورت hoist-شده هستند. ابتدا تابع hoisting را بررسی میکنیم. اساساً مفسر جاوا اسکریپت به دنبال همه اعلانهای متغیرها میگردد و آنها را به ابتدای تابع یعنی جایی که اعلان شده hoist میکند. مثال زیر را در نظر بگیرید.
1foo(); // Here foo is still undefined
2var foo = function foo() {
3 return 12;
4};
کد فوق در پسزمینه چیزی شبیه زیر است:
1var foo = undefined;
2foo(); // Here foo is undefined
3foo = function foo() {
4 // Some code stuff
5}
1var foo = undefined;
2foo = function foo() {
3 // Some code stuff
4}
5foo(); // Now foo is defined here
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نوزدهم
خروجی کد فوق به صورت undefined, 5000$ است، زیرا hoisting رخ داده است. در کد ارائه شده فوق ممکن است ببینید که salary مقدار خارج از دامنه خود را تا زمانی که salary در دامنه درونی دوباره اعلان میشود، نگهداری میکند. اما میبینیم که مقدار حقوق hoisting به صورت undefined است. برای درک بهتر این مسئله باید کد زیر را بررسی کنید. در کد زیر متغیر salary به صورت hosit است و در ابتدای دامنه تابع اعلان شده است. هنگامی که مقدار آن را با استفاده از console.log چاپ میکنیم، نتیجه undefined است. در ادامه متغیر دوباره اعلان میشود و مقدار جدید 5000$ به آن انتساب مییابد.
1var salary = "1000$";
2
3(function () {
4 var salary = undefined;
5 console.log("Original salary was " + salary);
6
7 salary = "5000$";
8
9 console.log("My New Salary " + salary);
10})();
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال بیستم
Typeof یک عملگر است که رشتهای با هر نوع که ارسال شده باشد، بازگشت میدهد. عملگر typeof بررسی میکند آیا یک مقدار به یکی از هفت نوع ابتدایی یعنی number, string, boolean, object, function, undefined یا Symbol تعلق دارد یا نه. typeof(null) مقداری به صورت object بازگشت میدهد.
Instanceof هوشمندانهتر عمل میکند و در سطح پروتوتایپ وارد عمل میشود. به طور خاص بررسی میکند آیا عملوند مناسبی در هر جایی در زنجیره پروتوتایپ سمت چپ استفاده شده است یا نه. Instanceof روی انواع مقدماتی کاربرد ندارد. عملگر instanceof شیء کنونی را بررسی کرده و در صورتی که آن شیء از نوع خاصی باشد مقدار true بازگشت میدهد. به مثال زیر توجه کنید.
1var dog = new Animal();
2dog instanceof Animal; // Output : true
در کد فوق، dog instanceof Animal مقدار true دارد، زیرا dog از Animal.prototype ارث میبرد.
1var name = new String("xyz");
2name instanceof String; // Output : true
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال بیست و یکم
قبل از هر چیز باید اشاره کنیم که آرایه انجمنی در جاوا اسکریپت همان شیء است. دوما با این که هیچ تابع یا مشخصه داخلی برای محاسبه طول/اندازه یک شیء وجود ندارد، اما میتوانیم خودمان چنین تابعی بنویسیم.
روش اول
Object دارای متد keys است که میتواند برای محاسبه طول شیء مورد استفاده قرار گیرد.
1Object.keys(counterArray).length; // Output 3
روش دوم
همچنین میتوانیم طول شیء را با تعریف حلقه روی شیء و شمارش مشخصههای شیء محاسبه کنیم. در این روش مشخصههایی که از زنجیره پروتوتایپ شیء هستند نادیده گرفته میشوند.
1function getLength(object) {
2 var count = 0;
3 for(key in object) {
4 // hasOwnProperty method check own property of object
5 if(object.hasOwnProperty(key)) count++;
6 }
7 return count;
8}
روش سوم
همه مرورگرهای مدرن از متد etOwnPropertyNames پشتیبانی میکنند و از ای رو میتوانیم با استفاده از کد زیر طول شیء را حساب کنیم:
1Object.getOwnPropertyNames(counterArray).length; // Output 3
روش چهارم
کتابخانههای Underscore و lodash دارای متد size هستند که اختصاص به محاسبه طول شیء دارد. توجه کنید که گنجاندن این کتابخانهها صرفاً برای محاسبه طول یک آرایه کار معقولی نیست، اما اگر از قبل در پروژه خود دارید میتوانید با استفاده از کد زیر طول شیء را حساب کنید:
1_.size({one: 1, two: 2, three: 3});
2=> 3
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سوال بیست و دوم
اگر با برنامهنویسی شیءگرا آشنا باشید، به احتمال زیاد با مفاهیم تابع، متد و سازندههای کلاس نیز آشنا هستید. اما در جاوا اسکریپت این موارد صرفاً سه الگوی کاربرد متفاوت از یک سازه واحد هستند.
تابعها: سادهترین کاربرد یک فراخوانی تابع چنین است.
1function helloWorld(name) {
2 return "hello world, " + name;
3}
4
5helloWorld("JS Geeks"); // "hello world JS Geeks"
متدها در جاوا اسکریپت چیزی بیش از مشخصه شیء از جنس تابع نیستند.
1var obj = {
2 helloWorld : function() {
3 return "hello world, " + this.name;
4 },
5 name: 'John Carter'
6}
7obj.helloWorld(); // // "hello world John Carter"
توجه کنید که helloWorld به مشخصه this در obj اشاره میکند. احتمالاً متوجه شدهاید که this با obj پیوند دارد. اما نکته جالب این است که میتوانیم یک ارجاع به همان تابع helloWorld را در شیء دیگر کپی کرده و پاسخ متفاوتی دریافت کنیم. به مثال زیر توجه کنید.
1var obj2 = {
2 helloWorld : obj.helloWorld,
3 name: 'John Doe'
4}
5obj2.helloWorld(); // "hello world John Doe"
ممکن است تعجب کنید که در فراخوان متد دقیقاً چه اتفاقی میافتد. ر این متد خود عبارت را فرا میخوانیم تا اتصال آن با this را تعیین کنیم. عبارت ()obj2.helloWorld به بررسی مشخصه helloWorld از شیء obj میپردازد و با استفاده از شیء دریافتکننده obj2 آن را فرا میخواند.
سومین کاربرد تابع به عنوان «سازنده» (constructor) است. سازندهها نیز همانند تابعها و متدها با استفاده از یک تابع تعریف میشوند.
1function Employee(name, age) {
2 this.name = name;
3 this.age = age;
4}
5
6var emp1 = new Employee('John Doe', 28);
7emp1.name; // "John Doe"
8emp1.age; // 28
برخلاف فراخوانی تابع و فراخوانی متد، فراخوانی سازنده مانند new Employee('John Doe', 28) موجب ایجاد یک شیء کاملاً جدید میشود و آن را به عنوان مقدار this ارسال میکند و به طور ضمنی شیء جدید را به عنوان نتیجهاش بازگشت میدهد.
نقض اصلی تابع سازنده، مقداردهی شیء است.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال بیست و سوم
خروجی کد فوق میتواند USA باشد. در این کد new User("xyz") یک شیء کاملاً جدید ایجاد میکند و مشخصه ایجاد شده location روی آن و USA به مشخصه مکان شیء انتساب مییابد و از سوی فرد مورد ارجاع قرار میگیرد.
فرض کنید یک شیء به نام foo ایجاد میکند. مقدار USA به foo["location"] انتساب مییابد، اما بر اساس مشخصههای ECMAScript خود انتساب مقدار سمت راست را بازگشت میدهد که در این مورد USA است که در ادامه به Person انتساب خواهد یافت.
برای درک بهتر اتفاقاتی که در کد فوق میافتد باید این کد را در کنسول به طور خط به خط اجرا کنیم:
1function User(name) {
2 this.name = name || "JsGeeks";
3}
4
5var person;
6var foo = new User("xyz");
7foo["location"] = "USA";
8// the console will show you that the result of this is "USA"
9
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال بیست و چهارم
سرویس ورکر یک فناوری است که به وب اپلیکیشنها امکان میدهد تا ابتدا از منابع کش شده بهره بگیرند و تجربه پیشفرض آفلاین را در اختیار کاربر قرار دهند و تنها پس از بارگذاری کامل صفحه است که اقدام به واکشی دادهها از شبکه میکند. این مفهوم عموماً به نام «ابتدا-آفلاین» (Offline First) خوانده میشود.
سرویس ورکرها به طور فعالانه از پرامیسها بهره میگیرند. یک سرویس ورکر باید نصب و فعال شود تا بتواند به رویدادهای واکشی، ارسال و همگامسازی واکنش نشان دهد.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال بیست و پنجم
تفاوت بین تابع و متد در زبان برنامهنویسی جاوا اسکریپت بسیار ظریف است. تابع قطعه کدی است که بر اساس نامش فراخوانی میشود و خود تابع هیچ ارتباط با شیء ندارد و درون شیء نیز تعریف نمیشود. تابع میتواند دادههایش را به جای دیگری ارسال کند یا از جای دیگری دریافت کند تا عملیاتی رویشان انجام یابد و میتواند به طور اختیاری دادهها را به صورت خروجی ارائه کند.
1// Function statement
2function myFunc() {
3 // Do some stuff;
4}
5
6// Calling the function
7myFunc();
در کد فوق تابع ()myFunc با شیء ارتباطی ندارد و از این رو از طریق هیچ شیئی احضار نمیشود. تابع میتواند به صورت یک «عبارت تابعی با احضار بیدرنگ» (IIFE) مانند مثال زیر باشد.
1// Anonymous Self-invoking Function
2(function() {
3 // Do some stuff;
4})();
در نهایت تابعهای arrow نیز به شکل زیر هستند:
1const myFunc = arg => {
2 console.log("hello", arg)
3}
در سوی دیگر، متد قطعه کدی است که به وسیله نامش فراخوانده میشود و با یک شیء ارتباط دارد. زمانی که یک متد را به صورت ()obj1.myMethod فرا میخوانید، ارجاع به obj1 با متغیر this پیوند مییابد. به بیان دیگر، مقدار this همان obj1 درون myMethod خواهد بود. در ادامه برخی مثالهای دیگر از متدها را ملاحظه میکنید.
مثال یکم
1var obj1 = {
2 attribute: "xyz",
3 myMethod: function () { // Method
4 console.log(this.attribute);
5 }
6};
7
8// Call the method
9obj1.myMethod();
در کد فوق obj1 یک شیء است و myMethod متدی است که با obj1 ارتباط دارد.
مثال دوم
در ES6 با مفهوم کلاس سروکار داریم. از این رو برخی متدها مانند زیر وجود دارند.
1class MyAwesomeClass {
2 myMethod() {
3 console.log("hi there");
4 }
5}
6
7const obj1 = new MyAwesomeClass();
8obj1.myMethod();
توجه کنید که متد نوع خاصی از تابع نیست و تفاوت آن با تابع به شیو اعلان کردنش بستگی ندارد. در واقع شیوه فراخوانی است که تفاوت این دو را مشخص میکند. به مثال زیر توجه کنید.
1var obj1 = {
2 prop1: "buddy"
3};
4var myFunc = function () {
5 console.log("Hi there", this);
6};
7// let's call myFunc as a function:
8myFunc(); // will output "Hi there undefined" or "Hi there Window"
9
10obj1.myMethod = myFunc;
11//now we're calling myFunc as a method of obj1, so this will point to obj1
12obj1.myMethod(); // will print "Hi there" following with obj1.
13
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال بیست و ششم
IIFE تابعی است که به محض تعریف شدن اجرا میشود. این تابع به طور معمول ناشناس (بینام) است، اما میتواند دارای نام نیز باشد. در ادامه نمونهای از یک IIFE را میبینید.
1(function() {
2 console.log("Hi, I'm IIFE!");
3})();
4// outputs "Hi, I'm IIFE!"
اگر تفاوت بین گزارههای تابعی (function a () {}) و عبارت تابعی (var a = function() {}) را به خاطر داشته باشید، متوجه خواهید شد که IIFE یک عبارت تابعی است. برای این که آن را به یک عبارت تبدیل کنیم، اعلان تابع را درون پرانتز قرار میدهیم. در واقع با انجام این کار به پارسر اعلام میکنیم این یک عبارت و نه یک گزاره است.
پس از تابع دو پرانتز مشاهده میشود که نشانگر شیوه اجرای تابع اعلان شده است.
تابع درون IIFE لزومی به ناشناس بودن ندارد. در واقع تخصیص نام به این توابع به درستی کار میکند و به تشخیص مشکلات در زمان دیباگ کردن مشکلات کمک زیادی خواهد کرد.
1(function myIIFEFunc() {
2 console.log("Hi, I'm IIFE!");
3})();
4// outputs "Hi, I'm IIFE!"
توابع IIFE میتوانند پارامتر بگیرند.
1(function myIIFEFunc(param1) {
2 console.log("Hi, I'm IIFE, " + param1);
3})("Yuri");
4// outputs "Hi, I'm IIFE, Yuri!"
در کد فوق Yuri به پارامتر param1 تابع ارسال شده است.
توابع IIFE میتوانند مقداری بازگشت دهند.
1var result = (function myIIFEFunc(param1) {
2 console.log("Hi, I'm IIFE, " + param1);
3 return 1;
4})("Yuri");
5// outputs "Hi, I'm IIFE, Yuri!"
6// result variable will contain 1
نیازی به قرار دادن اعلان تابع درون پرانتز وجود ندارد، گرچه این رایجترین شیوه تعریف IIFE است. در عوض میتوانید از هر یک از شکلهای زیر بهره بگیرید.
- ~function(){console.log("hi I'm IIFE")}()
- !function(){console.log("hi I'm IIFE")}()
- +function(){console.log("hi I'm IIFE")}()
- -function(){console.log("hi I'm IIFE")}()
- (function(){console.log("hi I'm IIFE")}());
- var i = function(){console.log("hi I'm IIFE")}();
- true && function(){ console.log("hi I'm IIFE") }();
- 0, function(){ console.log("hi I'm IIFE") }();
- new function(){ console.log("hi I'm IIFE") }
- new function(){ console.log("hi I'm IIFE") }()
توجه کنید که نباید از همه این اشکال تعریف تابع همزمان استفاده کنید، این موارد صرفاً به این خاطر ارائه شدهاند که هر گاه آنها را در قطعه کدی دید شگفتزده نشوید.
کاربردها و فواید IIFE
متغیرها و توابعی که درون IIFE اعلان میشوند از دید دنیای خارج پنهان هستند. این مسئله موجب ایجاد خصوصیات و فواید زیر میشود.
- از IIFE برای جدا کردن بخشی از کد و پنهان کردن جزئیات پیادهسازی استفاده کنید.
- اینترفیس ورودی کد را با ارسال اشیای سراسری پر استفاده (از قبیل window, document, jQuery و غیره)، پارامترهای IIFE و سپس ارجاع به این اشیای سراسری درون IIFE از طریق یک دامنه لوکال مشخصتر کنید.
- زمانی که کلوژر داخل حلقه قرار دارد میتوانید از توابع IIFE درون کلوژر استفاده کنید.
- IIFE مبنای الگوی ماژول در کد ES5 است و به جلوگیری از آلودگی دامنه سراسری کمک کرده و اینترفیس ماژول را در اختیار دنیای بیرون قرار میدهد.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال بیست و هفتم
«الگوی سینگلتون» (singleton pattern) یک الگوی طراحی پراستفاده در جاوا اسکریپت محسوب میشود. این الگو روشی برای بستهبندی کد درون یک واحد منطقی ارائه میکند که میتواند از طریق یک متغیر منفرد مورد دسترسی قرار گیرد. الگوی طراحی سینگلتون زمانی استفاده میشود مکه تنها یک وهله از شیء در سراسر عمر اپلیکیشن مورد نیاز باشد. در جاوا اسکریپت الگوی سینگلتون کاربردهای زیادی دارد و میتواند برای ایجاد فضای نام (NameSpacing) استفاده شود که موجب کاهش تعداد متغیرهای سراسری در صفحه شود. همچنین برای سازماندهی کد به یک شیوه منسجم نیز کاربرد دارد که موجب افزایش خوانایی و قابلیت نگهداری صفحههای خواهد شد.
دو نکته مهم در مورد تعریف سنتی از الگوی سینگلتون وجود دارند:
- تنها یک وهله مجاز برای هر کلاس باید وجود داشته باشد
- و باید امکان نقطه دسترسی سراسری به آن وهله سینگلتون عرضه شده باشد.
تعریف الگوی سینگلتون در چارچوب جاوا اسکریپت به صورت زیر است:
سینگلتون شیئی است که برای ایجاد فضای نام و گروهبندی مجموعه مرتبطی از متدها و خصوصیات (کپسولهسازی) مورد استفاده قرار میگیرد و اگر امکان مقداردهی داشته باشد، تنها یک بار میتواند مقداردهی شود.
در جاوا اسکریپت میتوان از طریق «لفظ شیئی» (object literal) یک سینگلتون ساخت. با این حال روشهای دیگری نیز به این منظور وجود دارند.
یک شیء سینگلتون از دو بخش تشکیل یافته است که بخش اول خود شیء است که شامل اعضا (چه متد و جه خصوصیت) میشود و دیگری متغیر سراسری است که برای دسترسی به شیء مورد استفاده قرار میگیرد. متغیر به این جهت سراسری تعریف میشود که بتوان از هر جایی در صفحه به شیء سینگلتون دسترسی افت چون این یک خصوصیت کلیدی الگوی سینگلتون محسوب میشود.
سینگلتون به مثابه فضای نام در جاوا اسکریپت
همچنان که پیشتر اشاره شد سینگلتون میتواند برای اعلان فضای نام در جاوا اسکریپت مورد استفاده قرار گیرد. ایجاد فضای نام بخش مهمی از برنامهنویسی معقول در جاوا اسکریپت است. از آن جا که هر چیزی را میتوان بازنویسی کرد و ممکن است به سادگی به اشتباه یا از طریق یک تابع یا حتی از طریق یک کلاس بدون هیچ گونه اطلاع، متغیر را به کل پاک کرد. یک مثال رایج که به کرات رخ میدهد زمانی است که به طور موازی با یکی دیگر از اعضای تیم همکاری میکنید.
1function findUserName(id) {
2
3}
4
5/* Later in the page another programmer
6added code */
7var findUserName = $('#user_list');
8
9/* You are trying to call :( */
10console.log(findUserName())
یکی از بهترین روشها برای جلوگیری از بازنویسی تصادفی متغیر این است که کد خود را درون یک شیء سینگلتون به صورت فضای نام دربیاورید.
1/* Using Namespace */
2
3var MyNameSpace = {
4 findUserName : function(id) {},
5 // Other methods and attribute go here as well
6}
7
8/* Later in the page another programmer
9added code */
10var findUserName = $('#user_list');
11
12/* You are trying to call and you make this time workable */
13console.log(MyNameSpace.findUserName());
پیادهسازی الگوی طراحی سینگلتون
1/* Lazy Instantiation skeleton for a singleton pattern */
2
3var MyNameSpace = {};
4MyNameSpace.Singleton = (function() {
5
6 // Private attribute that holds the single instance
7 var singletonInstance;
8
9 // All of the normal code goes here
10 function constructor() {
11 // Private members
12 var privateVar1 = "Nishant";
13 var privateVar2 = [1,2,3,4,5];
14
15 function privateMethod1() {
16 // code stuff
17 }
18
19 function privateMethod1() {
20 // code stuff
21 }
22
23 return {
24 attribute1 : "Nishant",
25 publicMethod: function() {
26 alert("Nishant");// some code logic
27 }
28 }
29 }
30
31 return {
32 // public method (Global access point to Singleton object)
33 getInstance: function() {
34 //instance already exist then return
35 if(!singletonInstance) {
36 singletonInstance = constructor();
37 }
38 return singletonInstance;
39 }
40 }
41
42})();
43
44// getting access of publicMethod
45console.log(MyNamespace.Singleton.getInstance().publicMethod());
سینگلتون پیادهسازی شده فوق به سادگی درک میشود. کلاس سینگلتون یک ارجاع استاتیک به وهله منفرد سینگلتون نگه میدارد و این ارجاع را از طریق متد استاتیک ()getInstance بازگشت میدهد.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال بیست و هشتم
روشهای مختلفی برای ایجاد شیء در جاوا اسکریپت وجود دارند که در ادامه برخی از آنها را بر میشماریم.
روش یکم: بر اساس تابع
این روش زمانی مفید است که بخواهیم چند شیء مشابه را ایجاد کنیم. در نمونه کد زیر تابع Employee را نوشتهایم و از طریق فراخوانیاش با عملگر new از آن به عنوان یک سازنده بهره گرفتهایم.
1 function Employee(fName, lName, age, salary){
2 this.firstName = fName;
3 this.lastName = lName;
4 this.age = age;
5 this.salary = salary;
6 }
7
8 // Creating multiple object which have similar property but diff value assigned to object property.
9 var employee1 = new Employee('John', 'Moto', 24, '5000$');
10 var employee2 = new Employee('Ryan', 'Jor', 26, '3000$');
11 var employee3 = new Employee('Andre', 'Salt', 26, '4000$');
روش دوم: لفظ شیئی
لفظ شیئی بهترین روش برای ایجاد یک شیء است و کاربرد زیادی دارد. در ادامه نمونه کدی برای ایجاد شیء کارمند (employee) میبینید که شامل مشخصهها و همچنین متد است.
1var employee = {
2 name : 'Nishant',
3 salary : 245678,
4 getName : function(){
5 return this.name;
6 }
7}
نمونه کد زیر یک لفظ شیئی تودرتو است که در آن آدرس یک شیء درون شیء کارمند است.
1var employee = {
2 name : 'Nishant',
3 salary : 245678,
4 address : {
5 addressLine1 : 'BITS Pilani',
6 addressLine2 : 'Vidya Vihar'.
7 phoneNumber: {
8 workPhone: 7098889765,
9 homePhone: 1234567898
10 }
11 }
12}
روش سوم: ساخت از Object با استفاده از کلیدواژه new
در کد زیر یک شیء ساده با استفاده از تابع سازنده Object ساخته میشود.
1var employee = new Object(); // Created employee object using new keywords and Object()
2employee.name = 'Nishant';
3employee.getName = function(){
4 return this.name;
5}
روش چهارم: ** با استفاده از Object.create
تابع Object.create(obj) یک شیء جدید ایجاد کرده و obj را برابر با پروتوتایپ آن قرار میدهد. این یک روش مدرن برای ایجاد اشیا است که در آن مشخصهها از اشیای دیگر ارثبری میکنند. تابع Object.create سازنده را اجرا نمیکند. امکان استفاده از Object.create(null) در مواردی که قصد ارثبری مشخصهها از Object را نداشته باشیم نیز فراهم آمده است.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال بیست و نهم
1function deepClone(object){
2 var newObject = {};
3 for(var key in object){
4 if(typeof object[key] === 'object' && object[key] !== null ){
5 newObject[key] = deepClone(object[key]);
6 }else{
7 newObject[key] = object[key];
8 }
9 }
10 return newObject;
11}
در این سؤال از ما خواسته شده است که یک کپی عمیق از شیء بسازیم و از این رو باید ابتدا معنی کپی عمیق را بدانیم. فرض کنید یک شیء به نام personalDetail به شما داده شده و این شیء شامل برخی مشخصهها است که خود نوعی شیء هستند. برای نمونه چنان که میبینیم address یک شیء است و نیز یک address و یک شیء است به بیان ساده یک شیء تودرتو است. به این ترتیب کپی عمیق به این معنا است که باید یک کپی از همه مشخصههای شیء personalDetail داشته باشیم که حتی شامل شیء تودرتو نیز باشد.
1var personalDetail = {
2 name : 'Nishant',
3 address : {
4 location: 'xyz',
5 zip : '123456',
6 phoneNumber : {
7 homePhone: 8797912345,
8 workPhone : 1234509876
9 }
10 }
11}
بنابراین زمانی که یک کلون عمیق ایجاد میکنیم باید همه مشخصهها از جمله اشیای تودرتو را نیز کپی کنیم.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سیام
فرض کنید شیئی به نام person داریم.
1var person = {
2 name: 'Nishant',
3 age : 24
4}
در این کد شیء person دارای مشخصههای name و age است. اکنون تلاش میکنیم تا به مشخصه salary دسترسی پیدا کنیم که روی شیء person اعلان شده، اما در زمان دسترسی یک مقدار تعریف نشده بازگشت مییابد. اینک سؤال این است که پیش از اجرای هر نوع عملیات روی یک شیء از کجا میتوانیم مطمئن باشیم که کدام مشخصه تعریف نشده است؟
امکان استفاده از عملگر typeof برای بررسی undefined به شکل زیر وجود دارد.
1if(typeof someProperty === 'undefined'){
2 console.log('something is undefined here');
3}
اکنون تلاش میکنیم به مشخصه حقوق شیء person دسترسی داشته باشیم.
1if(typeof person.salary === 'undefined'){
2 console.log("salary is undefined here because we haven't declared");
3}
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سی و یکم
1function Clone(object){
2 var newObject = {};
3 for(var key in object){
4 newObject[key] = object[key];
5 }
6 return newObject;
7}
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سی و دوم
از promise برای مدیریت تعاملهای ناهمگام به شیوه ترتیبی استفاده میکنیم. این موارد به طور خاص زمانی مفید هستند که یک عملیات ناهمگام (async) انجام داده باشیم و «سپس» بخواهیم بر مبنای نتایج عملیات نخست، عملیات ناهمگام دیگری انجام دهیم. برای نمونه اگر بخواهیم فهرست همه پروازها را به دست آوریم و سپس در مورد برخی پروازها که علاقهمند هستیم، جزییات بیشتری ببینیم، میتوانیم از پرامیس بهره بگیریم. پرامیس نماینده یک مقدار آتی است. پرامیس یک وضعیت درونی به شکلهای pending, fulfilled و rejected دارد و به عنان یک ماشین حالت عمل میکند.
شیء promise دارای متد then است که در آن کاری که پس از برآورده یا رد شدن پرامیس باید انجام یابد را مشخص میکنیم.
میتوان بلوکهای ()then را به هم زنجیر کرد و از این رو از بروز زنجیره تودرتوی callback اجتناب ورزید. امکان مدیریت خطاها در بلوک ()catch وجود دارد. پس از آن که یک پرامیس وارد حالت موفقیت یا شکست شد، «تغییرناپذیر» (immutable) میشود.
همچنین لازم به ذکر است که باید در مورد مفاهیم پیچیدهتر مانند زیر نیز اطلاعات داشته باشید.
- async/await موجب میشود که ظاهر کد هر چه بیشتر سرراست شود.
- observable-های RxJS را میتوان به عنوان پرامیسهای قابل بازیافت در نظر گرفت.
در هر صورت باید مطمئن شوید که امکان پیادهسازی پرامیس را دارید.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سی و سوم
فرض کنید یک شیء person با مشخصه name و age مانند زیر داریم:
1var person = {
2 name: 'Nishant',
3 age: 24
4}
اکنون میخواهیم بررسی کنیم مشخصه name در شیء person وجود دارد یا نه. در شیء جاوا اسکریپت میتوان یک مشخصه تعریف کرد. در مثال فوق، نام و سن مشخصههای خود شیء فرد (person) هستند. همچنین شیء برخی مشخصههای ارثبریشده از شیء مبنا از قبیل toString دارد.
بنابراین سؤال این است که چطور باید بررسی کنیم مشخصهها متعلق به خود شیء هستند یا ارثبری شدهاند؟
روش اول: ما میتوانیم از عملگر in روی شیء استفاده کنیم تا ببینیم آیا مشخصه متعلق به خودش است یا ارثبری شده است.
console.log('name' in person); // checking own property print true console.log('salary' in person); // checking undefined property print false
عملگر in همچنین به دنبال مشخصه ارثبریشده میگردد تا ببیند آیا مشخصه تعریف شده را به عنوان مشخصه خودشی پیدا میکند یا نه. برای نمونه اگر وجود مشخصه toString را بررسی کنیم، از آنجا که میدانیم این مشخصه را روی شیء person اعلان نکردهایم، از این رو عملگر in روی مشخصههای مبنا به دنبال آن میگردد.
به مثال زیر توجه کنید.
console.log('toString' in person); // Will print true
اگر بخواهیم مشخصه یک وهله از شیء را بررسی کنیم که مشخصه ارثبری شده است یا نه، از متد hasOwnProperty وهله شیء استفاده میکنیم.
console.log(person.hasOwnProperty('toString')); // print false console.log(person.hasOwnProperty('name')); // print true console.log(person.hasOwnProperty('salary')); // print false
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سی و چهارم
NaN اختصاری برای عبارت «غیر عددی» (not a number) است و در صورتی که بخواهید یک عملیات حسابی روی چنین مقادیری اجرا کنید، ممکن است موجب از کار افتادن عملیات شود. در ادامه برخی از مواردی که میتوانید مقدار NaN دریافت نمایید را ملاحظه میکنید.
1Math.sqrt(-5);
2Math.log(-1);
3parseFloat("foo"); /* this is common: you get JSON from the server, convert some strings from JSON to a number and end up with NaN in your UI. */
NaN با هیچ عددی برابر نخواهد بود، کمتر یا بیشتر از هیچ عددی نمیشود و هرگز حتی با خودش هم برابر نیست:
1NaN !== NaN
2NaN < 2 // false
3NaN > 2 // false
4NaN === 2 // false
برای این که بررسی کنیم آیا متغیر کنونی NaN است یا خیر، میتوانیم از تابع isNaN بهره بگیریم. به همین جهت است که غالباً NaN را در صفحهها میبینیم، چون به بررسی خاصی نیاز دارد که بسیاری از توسعهدهندگان اجرای آن را فراموش میکنند.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سی و پنجم
در صورت استفاده از ES6 میتوانستیم var i را با let i عوض کنیم. اما در ES5 باید یک دامنه تابع مانند زیر بسازیم:
1var arr = [10, 32, 65, 2];
2for (var i = 0; i < arr.length; i++) {
3 setTimeout(function(j) {
4 return function () {
5 console.log('The index of this number is: ' + j)
6 };
7 }(i), 3000);
8}
این نتیجه با استفاده از forEach نیز حاصل میشود.
1var arr = [10, 32, 65, 2];
2arr.forEach(function(ele, i) {
3 setTimeout(function() {
4 console.log('The index of this number is: ' + i);
5 }, 3000);
6})
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سی و ششم
در اغلب مواقع متوجه میشویم که لازم است بررسی کنیم نوع متغیری آرایه است یا نه. برای نمونه در کد زیر نوعی عملیات را بر اساس نوع مقدار اجرا میکنیم.
1function(value){
2 if("value is an array"){
3 // Then perform some operation
4 }else{
5 // otherwise
6 }
7}
در ادامه با روشهای تشخیص آرایه در جاوا اسکریپت آشنا میشویم.
روش اول: یک روش عالی به این منظور به صورت زیر است.
1 function isArray(value){
2 return Object.prototype.toString.call(value) === '[object Array]';
3 }
این رویکرد محبوبترین روش برای تشخیص یک مقدار از نوع آرایه در جاوا اسکریپت است و استفاده از
آن توصیه میشود. این رویکرد بر این واقعیت استوار است که متد نیتیو ()toString روی یک مقدار مفروض یک رشته استاندارد در همه مرورگرها ایجاد میکند.
روش دوم
تست نوعبندی اردکی برای تشخیص نوع آرایه
1 // Duck typing arrays
2 function isArray(value){
3 return typeof value.sort === 'function';
4 }
چنان که میبینیم متد isArray زمانی مقدار درست بازگشت میدهد که شیء مورد بررسی دارای متد sort از نوع function باشد. اکنون فرض کنید شیئی با متد سورت ایجاد کردده باشیم:
1 var bar = {
2 sort: function(){
3 // Some code
4 }
5 }
اکنون زمانی که isArray(bar) را بررسی کنیم، مقدار true بازگشت میدهد، زیرا شیء bar دارای متد sort است، اما واقعیت این است که bar آرایه نیست.
بنابراین این روش بهترین روش برای تشخیص یک آرایه نیست، زیرا حالتی که شیء دارای متد sort باشد را مدیریت نمیکند.
روش سوم
ECMAScript 5 یک متد به نام ()Array.isArray معرفی کرده است که مقدار نوع آرایه را تشخیص میدهد. تنها هدف این متد آن است که به درستی تشخیص دهد آیا مقدار مفروض یک آرایه است یا نه. در بسیاری از کتابخانههای جاوا اسکریپت ممکن است کد زیر را برای تشخیص آرایه بودن ببینید.
1function(value){
2 // ECMAScript 5 feature
3 if(typeof Array.isArray === 'function'){
4 return Array.isArray(value);
5 }else{
6 return Object.prototype.toString.call(value) === '[object Array]';
7 }
8}
روش چهارم
امکان کوئری زدن به نام سازنده نیز وجود دارد:
1function isArray(value) {
2 return value.constructor.name === "Array";
3}
4
روش پنجم
همچنین میتوان با استفاده از instanceof Array آرایه بودن یک مقدار را بررسی کرد:
1function isArray(value) {
2 return value instanceof Array;
3}
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سی و هفتم
اشیای جاوا اسکریپت به صورت ارجاعی فراخوانی میشوند. هر مقدار به جز مقادیر ابتدایی قطعاً یک نوع ارجاعی است. چند نوع ارجاعی داخلی مانند Object, Array, Function, Date, null و Error در جاوا اسکریپت وجود دارند.
تشخیص یک شیء با استفاده از عملگر typeof ممکن است.
1console.log(typeof {}); // object
2console.log(typeof []); // object
3console.log(typeof new Array()); // object
4console.log(typeof null); // object
5console.log(typeof new RegExp()); // object
6console.log(typeof new Date()); // object
اما عیب استفاده از عملگر typeof برای تشخیص نوع شیء این است که برای null نیز مقدار object بازگشت میدهد.
بهترین روش برای تشخیص یک شیء با نوع ارجاعی خاص استفاده از عملگر instanceof است.
1//Detecting an array
2if(value instanceof Array){
3 console.log("value is type of array");
4}
1// Employee constructor function
2function Employee(name){
3 this.name = name; // Public property
4}
5
6var emp1 = new Employee('John');
7
8console.log(emp1 instanceof Employee); // true
عملگر instanceof نه تنها سازندهای که برای ایجاد یک شیء استفاده شده را تشخیص میدهد، بلکه زنجیره پروتوتایپ آن را نیز مورد بررسی قرار میدهد.
1console.log(emp1 instanceof Object); // true
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سی و هشتم
متد ()Object.create در ECMAScript 5 آسانترین روش برای ارثبری یک شیء از شیء دیگر بدون احضار تابع سازنده است. به مثال زیر توجه کنید.
1var employee = {
2 name: 'Nishant',
3 displayName: function () {
4 console.log(this.name);
5 }
6};
7
8var emp1 = Object.create(employee);
9console.log(emp1.displayName()); // output "Nishant"
در مثال فوق یک شیء جدید به نام emp1 ایجاد میکنیم که از employee ارثبری میکند. به بیان دیگر پروتوتایپ emp1 روی employee تنظیم شده است. پس از آن، این emp1 توانایی دسترسی به همان مشخصهها و متد را روی employee پیدا میکند تا این که مشخصهها یا متد جدید با همان نام تعریف شود.
برای نمونه تعریف کردن متد ()displayName روی emp1 موجب باطل شدن خودکار displayName در employee نمیشود.
1emp1.displayName = function() {
2 console.log('xyz-Anonymous');
3};
4
5employee.displayName(); //Nishant
6emp1.displayName();//xyz-Anonymous
علاوه بر این متد ()Object.create امکان تعیین آرگومان دوم را نیز میدهد که یک شیء شامل مشخصهها و متدهای اضافی برای افزودن به شیء جدید است. به مثال زیر توجه کنید.
1var emp1 = Object.create(employee, {
2 name: {
3 value: "John"
4 }
5});
6
7emp1.displayName(); // "John"
8employee.displayName(); // "Nishant"
در مثال فوق، emp1 با نام خودش ایجاد شده است، از این رو با فراخوانی متد ()displayName به جای Nishant با مقدار John مواجه میشویم. شیئی که به این روش ایجاد شود کنترل کاملی روی شیء جدیداً ایجاد شده میدهد. به این ترتیب آزاد هستید که هر مشخصه و متدی که میخواهید را حذف/اضافه کنید.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال سی و نهم
فرض کنید کلاس Person را داریم که دارای مشخصههای نام، سن، حقوق و متد ()incrementSalary است.
1function Person(name, age, salary) {
2 this.name = name;
3 this.age = age;
4 this.salary = salary;
5 this.incrementSalary = function (byValue) {
6 this.salary = this.salary + byValue;
7 };
8}
اکنون میخواهیم کلاس Employee را ایجاد کنیم که شامل همه مشخصههای کلاس Person است و همچنین میخواهیم مشخصههای دیگری را وارد کلاس Employee بکنیم.
1function Employee(company){
2 this.company = company;
3}
4
5//Prototypal Inheritance
6Employee.prototype = new Person("Nishant", 24,5000);
در مثال فوق نوع Employee از نوع Person ارثبری میکند. این کار از طریق ساخت وهله جدیدی از Person از روی پروتوتایپ Employee انجام مییابد. در ادامه هر وهله از Employee از مشخصهها و متدهای Employee ارث خواهد برد.
1//Prototypal Inheritance
2Employee.prototype = new Person("Nishant", 24,5000);
3
4var emp1 = new Employee("Google");
5
6console.log(emp1 instanceof Person); // true
7console.log(emp1 instanceof Employee); // true
اینک وراثت سازنده را بررسی میکنیم.
1//Defined Person class
2function Person(name){
3 this.name = name || "Nishant";
4}
5
6var obj = {};
7
8// obj inherit Person class properties and method
9Person.call(obj); // constructor inheritance
10
11console.log(obj); // Object {name: "Nishant"}
در کد فوق میبینیم که با فراخوانی Person.call(obj) مشخصههای نام از Person به obj تعریف میشوند.
1console.log(name in obj); // true
وراثت مبتنی بر نوع بهتر است با تابع سازنده تعریف شده توسعهدهنده استفاده شود تا توابع نیتیو جاوا اسکریپت. همچنین امکان ایجاد انعطاف در شیوه ساخت نوعهای مشابه از شیء در اختیار ما قرار میدهد.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال چهلم
ECMAScript 5 چندین روش برای جلوگیری از دستکاری شیء ارائه کرده است شیء را قفل میکند تا مطمئن شود که هیچ کس به طور تصادفی یا به هر طریق دیگر کارکرد شیء را تغییر نمیدهد. سه سطح از ممانعت دستکاری اشیا به شرح زیر وجود دارد.
اکستنشنهای ممانعت
در این روش هیچ مشخصه یا متد جدید نمیتواند به شیء اضافه شود، اما فرد میتواند مشخصهها یا متدهای موجود را تغییر دهد. به مثال زیر توجه کنید:
1var employee = {
2 name: "Nishant"
3};
4
5// lock the object
6Object.preventExtensions(employee);
7
8// Now try to change the employee object property name
9employee.name = "John"; // work fine
10
11//Now try to add some new property to the object
12employee.age = 24; // fails silently unless it's inside the strict mode
مهروموم
این روش مشابه روش قبلی است به جز این که از حذف شدن مشخصهها و متدهای موجود نیز ممانعت میکند.
برای مهروموم کردن یک شیء باید از متد ()Object.seal استفاده کنید. امکان بررسی کردن مهروموم بودن یکشی نیز با استفاده از ()Object.isSealed وجود دارد.
1var employee = {
2 name: "Nishant"
3};
4
5// Seal the object
6Object.seal(employee);
7
8console.log(Object.isExtensible(employee)); // false
9console.log(Object.isSealed(employee)); // true
10
11delete employee.name // fails silently unless it's in strict mode
12
13// Trying to add new property will give an error
14employee.age = 30; // fails silently unless in strict mode
هنگامی که یک شیء مهروموم میشود، مشخصهها و متدهای موجود نمیتوانند حذف شوند. شیء مهروموم شده غیر قابل بسط نیز هست.
فریز کردن
در این روش نیز مشابه مهروموم کردن، امکان دستکاری مشخصهها و متدهای موجود وجود ندارد و همه این موارد فقط-خواندنی هستند. برای فریز کردن یک شیء باید از متد استفاده کنیم. همچنین میتوانیم وضعیت فریز بودن را با استفاده از ()Object.isFrozen بررسی کنیم.
1var employee = {
2 name: "Nishant"
3};
4
5//Freeze the object
6Object.freeze(employee);
7
8// Seal the object
9Object.seal(employee);
10
11console.log(Object.isExtensible(employee)); // false
12console.log(Object.isSealed(employee)); // true
13console.log(Object.isFrozen(employee)); // true
14
15
16employee.name = "xyz"; // fails silently unless in strict mode
17employee.age = 30; // fails silently unless in strict mode
18delete employee.name // fails silently unless it's in strict mode
اشیای فرز شده هم مهر و موم و هم غیر قابل بسط هستند.
توصیههای مهم
اگر تصمیم دارید جلوی دستکاری یک شیء را بگیرید، آن را مهروموم یا فریز بکنید و سپس در حالت strict مورد استفاده قرار دهید تا بتوانید خطاها را به دام بیندازید. به مثال زیر توجه کنید.
1"use strict";
2
3var employee = {
4 name: "Nishant"
5};
6
7//Freeze the object
8Object.freeze(employee);
9
10// Seal the object
11Object.seal(employee);
12
13console.log(Object.isExtensible(employee)); // false
14console.log(Object.isSealed(employee)); // true
15console.log(Object.isFrozen(employee)); // true
16
17
18employee.name = "xyz"; // fails silently unless in strict mode
19employee.age = 30; // fails silently unless in strict mode
20delete employee.name; // fails silently unless it's in strict mode
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال چهل و یکم
لاگ کردن پیامهای خطا یا برخی پیامهای آگاهیبخش در زمان کار با سمت کلاینت جاوا اسکریپت با استفاده از متد console.log امری ضروری محسوب میشود. گاهی اوقات لازم است که نوعی پیشوند به پیامهای لاگ اضافه کنیم تا مشخص شود کهان پیام از سمت یک اپلیکیشن خاص تولید شده است. یک روش کلی برای انجام این کار این است که به همه پیامکهای لاگ در کنسول یک نام مانند زیر اضافه کنیم:
1console.log('your app name' + 'some error message');
با انجام این کار باید هر بار که میخواهیم پیامی را در کنسول لاگ کنیم، نام اپلیکیشنمان را وارد کنیم. برای انجام این کار روش بهترین نیز وجود دارد:
1function appLog() {
2 var args = Array.prototype.slice.call(arguments);
3 args.unshift('your app name');
4 console.log.apply(console, args);
5}
6
7appLog("Some error message");
8//output of above console: 'your app name Some error message'
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال چهل و دوم
امکان استفاده از عملگر typeof برای تست این که رشتهای لفظی است وجود دارد و عملگر instanceof نیز شیء بودن رشته را بررسی میکند.
1 function isString(str) {
2 return typeof(str) == 'string' || str instanceof String;
3 }
4
5 var ltrlStr = "Hi I am string literal";
6 var objStr = new String("Hi I am string object");
7 console.log(isString(ltrlStr)); // true
8 console.log(isString(objStr)); // true
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال چهل و سوم
تابعهای بینام (anonymous) به طور معمول در موارد زیر به کار گرفته میشوند.
استفاده بیدرنگ
در صورتی که تابع بلافاصله پس از ایجاد مورد استفاده قرار گیرد، نیاز به نام نخواهد داشت. به عنوان مثال تابع setTimeout را در نظر بگیرید:
1setTimeout(function(){
2 alert("Hello");
3},1000);
در حالت فوق نیازی به استفاده از تابع نامدار وجود ندارد، چون مطمئن هستیم که این تابع که عبارت hello را نمایش میدهد تنها یک بار در اپلیکیشن استفاده میشود.
اعلان درونخطی تابع
اعلان تابعها به روش درونخطی (inline) مزیتهای زیادی دارد، از جمله امکان دسترسی به متغیر در دامنه کنونی را فراهم میسازد. برای نمونه یک مثال از «دستگیره رویداد» (event handler) را در نظر بگیرید. این دستگیره وجود یک نوع خاصی از رویداد را برای یک شیء خاص هشدار میدهد. فرض کنید یک عنصر HTML مانند یک Button داریم که میخواهیم روی آن یک دستگیره رویداد برای کلیک کردن اضافه کنیم تا وقتی کاربر روی دکمه کلیک کرد برخی کدها اجرا شوند.
1<button id="myBtn"></button>
شنونده رویداد را نیز اضافه میکنیم.
1var btn = document.getElementById('myBtn');
2btn.addEventListener('click', function () {
3 alert('button clicked');
4});
مثال فوق کاربرد تابع بینام را به عنوان یک تابع callback در دستگیره رویداد نشان میدهد.
ارسال تابع بینام به صورت پارامتر در زمان فراخوانی تابع
به مثال زیر توجه کنید.
1// Function which will execute callback function
2function processCallback(callback){
3 if(typeof callback === 'function'){
4 callback();
5 }
6}
7
8// Call function and pass anonymous function as callback
9processCallback(function(){
10 alert("Hi I am anonymous callback function");
11});
بهترین روش برای تصمیمگیری در مرد استفاده از تابع بینام این است که سؤالات زیر را از خود بپرسیم:
- آیا تابعی که تعریف میکنیم، جای دیگری استفاده خواهد شد؟
اگر پاسخ مثبت باشد، در این صورت باید از تابع نامدار استفاده شود و در غیر این صورت میتوان از تابع بینام کمک گرفت.
مزیت استفاده از تابع بینام
- کدهای که باید نوشته شود کاهش مییابند و این موضوع در موارد تابع بازگشتی و همچنین تابع callback مصداق بیشتری دارد.
- از آلودگی غیرضروری فضای نام سراسری جلوگیری میشود.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال چهل و چهارم
اگر قبلاً با زبانهای برنامهنویسی پایتون یا سی شارپ آشنا باشید، ممکن است با روش استفاده از مقدار پیشفرض برای پارامترهای تابع آشنایی داشته باشید. به مثال زیر توجه کنید:
1// Define sentEmail function
2// configuration : Configuration object
3// provider : Email Service provider, Default would be gmail
4def sentEmail(configuration, provider = 'Gmail'):
5 # Your code logic
قبل از معرفی ES6/ES2015
تا قبل از معرفی ES6/ES2015 روشهای زیادی برای انجام این کار وجود داشت. در ادامه کدی ارائه شده است که مقدار پارامتر پیشفرض را به یکی از این روشها تعیین میکند.
روش اول تعیین مقدار پارامتر پیشفرض
1function sentEmail(configuration, provider) {
2 // Set default value if user has not passed value for provider
3 provider = typeof provider !== 'undefined' ? provider : 'Gmail'
4 // Your code logic
5;
6}
7// In this call we are not passing provider parameter value
8sentEmail({
9 from: 'xyz@gmail.com',
10 subject: 'Test Email'
11});
12// Here we are passing Yahoo Mail as a provider value
13sentEmail({
14 from: 'xyz@gmail.com',
15 subject: 'Test Email'
16}, 'Yahoo Mail');
روش دوم تعیین مقدار پارامتر پیشفرض
1function sentEmail(configuration, provider) {
2 // Set default value if user has not passed value for provider
3 provider = provider || 'Gmail'
4 // Your code logic
5;
6}
7// In this call we are not passing provider parameter value
8sentEmail({
9 from: 'xyz@gmail.com',
10 subject: 'Test Email'
11});
12// Here we are passing Yahoo Mail as a provider value
13sentEmail({
14 from: 'xyz@gmail.com',
15 subject: 'Test Email'
16}, 'Yahoo Mail');
روش سوم تعیین مقدار پارامتر پیشفرض
1function sendEmail(configuration, provider = "Gmail") {
2 // Set default value if user has not passed value for provider
3
4 // Value of provider can be accessed directly
5 console.log(`Provider: ${provider}`);
6}
7
8// In this call we are not passing provider parameter value
9sentEmail({
10 from: 'xyz@gmail.com',
11 subject: 'Test Email'
12});
13// Here we are passing Yahoo Mail as a provider value
14sentEmail({
15 from: 'xyz@gmail.com',
16 subject: 'Test Email'
17}, 'Yahoo Mail');
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال چهل و پنجم
1merge(person , address);
2
3/* Now person should have 5 properties
4name , age , addressLine1 , addressLine2 , city */
روش اول: استفاده از ES6 و متد Object.assign
1const merge = (toObj, fromObj) => Object.assign(toObj, fromObj);
روش دوم: بدون استفاده از تابع داخلی
1function merge(toObj, fromObj) {
2 // Make sure both of the parameter is an object
3 if (typeof toObj === 'object' && typeof fromObj === 'object') {
4 for (var pro in fromObj) {
5 // Assign only own properties not inherited properties
6 if (fromObj.hasOwnProperty(pro)) {
7 // Assign property and value
8 toObj[pro] = fromObj[pro];
9 }
10 }
11 }else{
12 throw "Merge function can apply only on object";
13 }
14}
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال چهل و ششم
اشیای جاوا اسکریپت میتوانند مشخصههایی داشته باشند که وقتی با استفاده از حلقه for روی شیء میچرخید یا از ()Object.keys برای دریافت نامهای مشخصهها استفاده میکنید ظاهر نشوند. این مشخصهها به نام «مشخصههای غیر شمارشی» (non-enumerable properties) نامیده میشوند.
فرض کنید شیء زیر را داریم:
1var person = {
2 name: 'John'
3};
4person.salary = '10000$';
5person['country'] = 'USA';
6
7console.log(Object.keys(person)); // ['name', 'salary', 'country']
از آنجا که میدانیم شیء person دارای مشخصههای شمارشی name, salary و country است، هنگامی که Object.keys(person) را فرا بخوانیم ظاهر خواهند شد. برای ایجاد مشخصه غیر شمارشی باید از ()Object.defineProperty استفاده کنیم. این یک متد خاص برای ایجاد مشخصه غیر شمارشی در جاوا اسکریپت است.
1var person = {
2 name: 'John'
3};
4person.salary = '10000$';
5person['country'] = 'USA';
6
7// Create non-enumerable property
8Object.defineProperty(person, 'phoneNo',{
9 value : '8888888888',
10 enumerable: false
11})
12
13Object.keys(person); // ['name', 'salary', 'country']
در مثال فوق مشخصه phoneNo نشان داده نمیشود زیرا با تنظیم enumerable:false آن را غیر شمارشی کردهایم.
نکته مهم
اکنون فرض کنید میخواهیم مقدار phoneNo را تغییر دهیم.
1person.phoneNo = '7777777777';
متد ()Object.defineProperty امکان ایجاد مشخصههای «فقط-خواندنی» چنان که در بالا دیدیم را دارد و از این رو امکان دستکاری تغییر را در یک شیء person نداریم. دلیل این امر آن است که descriptor دارای مشخصه writable است که به طور پیشفرض FALSE است. تغییر دادن مقدار مشخصه غیر نوشتنی در حالت strict خطا بازگشت میدهد. در حالت غیر strict هیچ خطایی اتفاق نمیافتد، اما مقدار phoneNo تغییر نخواهد یافت.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال چهل و هفتم
اتصال تابع در حیطه موارد پیشرفته جاوا اسکریپت قرار میگیرد و یک تکنیک بسیار محبوب برای استفاده همراه با دستگیره رویداد و تابع کالبک جهت حفظ چارچوب کد اجرایی در زمان ارسال تابع به صورت پارامتر به حساب میآید.
مثال زیر را در نظر بگیرید.
1var clickHandler = {
2 message: 'click event handler',
3 handleClick: function(event) {
4 console.log(this.message);
5 }
6};
7
8var btn = document.getElementById('myBtn');
9// Add click event to btn
10btn.addEventListener('click', clickHandler.handleClick);
در کد فوق شیء clickHandler ایجاد شده است که شامل مشخصههای پیام و متد handleClick است.
ما متد handleClick را به یک دکمه DOM انتساب دادهایم که در پاسخ به فرایند کلیک اجرا میشود. هنگامی که دکمه کلیک شود، متد handleClick فراخوانی میشود و پیام کنسول فراخوانده میشود. در اینجا console.log باید پیام click event handler را لاگ کند، اما در عمل undefined را لاگ میکند.
مشکل نمایش undefined به این دلیل است که چارچوب اجرایی متد clickHandler.handleClick ذخیره نمیشود و از این رو this بله شیء دکمه btn اشاره میکند. با استفاده از متد bind میتوانیم این مشکل را رفع کنیم.
1var clickHandler = {
2 message: 'click event handler',
3 handleClick: function(event) {
4 console.log(this.message);
5 }
6};
7
8var btn = document.getElementById('myBtn');
9// Add click event to btn and bind the clickHandler object
10btn.addEventListener('click', clickHandler.handleClick.bind(clickHandler));
متد bind مشابه متدهای call و apply برای همه تابعها عرضه شده و مقدار آرگومان this را میگیرد.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال چهل و هشتم
خروجی کد فوق hi there است، زیرا در این جا به رشتهها سروکار داریم. رشتهها به صورت مقداری ارسال میشوند یعنی کپی خواهند شد.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال چهل و نهم
خروجی کد فوق به صورت {prop1: 90} است زیرا در اینجا با اشیا سروکار داریم. اشیا به صورت ارجاعی ارسال میشوند، یعنی objA و objB در حافظه شیء یکسانی هستند.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پنجاهم
خروجی این کد به صورت {prop1: 42} است. زمانی که objA به objB انتساب مییابد، متغیر objB به همان شیء که متغیر objb اشاره دارد، اشاره خواهد کرد.
اما زمانی که objB را برابر با یک شیء خالی قرار دهیم، در واقع ارجاع متغیر objB را به آن تغییر دادهایم. این کار تأثیری روی ارجاع متغیر objA نمیگذارد.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پنجاه و یکم
خروجی این کد به صورت [42,1,2,3,4,5] است. آرایهها در جاوا اسکریپت شیء محسوب میشوند. به صورت ارجاعی ارسال شده و انتساب مییابند. به همین دلیل است که هم arrA و هم arrB به همان آرایه اشاره دارند. از این رو تغییر دادن عنصر نخست آرایه arrB موجب ایجاد تغییر در arrA نیز میشود، چون در حافظه همان آرایه است.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پنجاه و دوم
خروجی این کد به صورت است. تابع slice همه عناصر آرایه را کپی کرده و یک آرایه جدید بازگشت میدهد. به همین دلیل است که arrA و arrB به دو آرایه کاملاً متفاوت اشاره میکنند.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پنجاه و سوم
خروجی این کد به صورت زیر است:
1[{prop1: 42}, {someProp: "also value of array A!"}, 3,4,5]
آرایهها اشیای جاوا اسکریپت هستند و از این رو هر دو متغیر arrA و arrB به آرایه یکسانی اشاره دارند. تغییر دادن arrB[0] همان تغییر دادن آرایه arrA[0] است.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پنجاه و چهارم
خروجی این کد به صورت زیر است:
1[{prop1: 42}, {someProp: "also value of array A!"}, 3,4,5]
تابع slice همه عناصر آرایه را کپی کرده و یک آرایه جدید بازگشت میدهد. با این حال این کپی یک کپی عمیق نیست؛ بلکه کپی سطحی انجام مییابد. این Slice که اجرا شده را میتوان به صورت زیر تصور کرد:
1function slice(arr) {
2 var result = [];
3 for (i = 0; i< arr.length; i++) {
4 result.push(arr[i]);
5 }
6 return result;
7}
به خط result.push(arr[i]) نگاه کنید. اگر arr[i] بر حسب تصادف عدد یا رشته باشد به صورت مقداری ارسال میشود، یعنی کپی میشود. اگر arr[i] آرایه باشد، به صورت ارجاعی ارسال میشود.
در صورتی که آرایه arr[i] یک شیء باشد، {prop1: "value of array A!!"} تنها ارجاع به این شیء کپی خواهد شد. این حرف به آن معنی است که آرایههای arrA و arrB دارای دو عنصر ابتدایی مشترک هستند.
به همین دلیل است گه تغییر دادن مشخصه arrB[0] در arrB موجب ایجاد تغییر در arrA[0] نیز میشود.
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پنجاه و پنجم
ReferenceError: employeeId is not defined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پنجاه و ششم
Undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پنجاه و هفتم
Undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پنجاه و هشتم
Undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال پنجاه و نهم
undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال شصتم
'123bcd'
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال شصت و یکم
'abc123'
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال شصت و دوم
Function
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال شصت و سوم
undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال شصت و چهارم
function function
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال شصت و پنجم
["name", "salary", "country", "phoneNo"]
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال شصت و ششم
["name", "salary", "country"]
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال شصت و هفتم
false false
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال شصت و هشتم
false false
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال شصت و نهم
false false
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفتادم
false false
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفتاد و یکم
true true
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفتاد و دوم
true true true true
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفتاد و سوم
bar bar
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفتاد و چهارم
foo foo
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفتاد و پنجم
undefined undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفتاد و ششم
["100"] 1
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفتاد و هفتم
[] [] [Array[5]] 1
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفتاد و هشتم
11
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هفتاد و نهم
6
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هشتادم
['dog', 'rat', 'goat', 'cow', 'horse', 'cat']
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هشتاد و یکم
1 -1 -1 4
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هشتاد و دوم
1 6 -1
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هشتاد و سوم
[2, 4, 8, 12, 16] true
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هشتاد و چهارم
[2, '12', true] [2, '12', true] [2, '12', true] [2, '12', true]
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هشتاد و پنجم
['bar', 'john', 'ritz'] ['bar', 'john'] ['foo', 'bar', 'john', 'ritz'] [] ['foo', 'bar', 'john', 'ritz']
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هشتاد و ششم
['bar', 'john'] [] ['foo']
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هشتاد و هفتم
[15, 16, 2, 23, 42, 8]
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هشتاد و هشتم
1
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال هشتاد و نهم
undefined true
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نودم
Hello
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نود و یکم
undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نود و دوم
'Hello'
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نود و سوم
undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نود و چهارم
'Hi John'
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نود و پنجم
'Hi John'
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نود و ششم
a) 2 2 2
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نود و هفتم
0 2 4
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نود و هشتم
John Person
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال نود و نهم
12345678 undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صدم
undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و یکم
bq1uy 1BJKSJ bq1uy
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و دوم
foo123 aq123
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و سوم
['W', 'o', 'r', 'l', 'd']
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و چهارم
Total amount left in account: 5600 Total amount left in account: 5300
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و پنجم
5600 5300 5100
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و ششم
3600 3300 3100
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و هفتم
Hello John
6. Suggest your question!
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و هشتم
John
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و نهم
[2, 8, 15, 16, 23, 42] [2, 8, 15, 16, 23, 42] [2, 8, 15, 16, 23, 42]
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و دهم
Uncaught TypeError: Cannot read property 'fullName' of undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و یازدهم
5
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و دوازدهم
undefined
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و سیزدهم
6, 10
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و چهاردهم
6, 10
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و پانزدهم
720
- برای مشاهده سوال + اینجا کلیک کنید.
پاسخ سؤال صد و شانزدهم
Tony undefined
توجه کنید که تابع ()getName1 به درستی کار میکند، زیرا از personObj فراخوانی شده و از این رو به مشخصه this.name دسترسی دارد. اما هنگامی که بخواهیم getnName2 را فرا بخوانیم که تحت Object.prototype تعریف شده، هیچ مشخصهای به نام this.name ندارد. باید یک مشخصه به نام name تحت پروتوتایپ وجود داشته باشد. کد آن چنین است:
1function getName1(){
2 console.log(this.name);
3}
4
5Object.prototype.getName2 = () =>{
6 console.log(Object.getPrototypeOf(this).name);
7}
8
9let personObj = {
10 name:"Tony",
11 print:getName1
12}
13
14personObj.print();
15Object.prototype.name="Steve";
16personObj.getName2();
- برای مشاهده سوال + اینجا کلیک کنید.
سخن پایانی
اگر علاقهمند به زبان برنامهنویسی جاوا اسکریپت باشید و فکر میکنید که مسیر آینده شغلی شما به این زبان گره خورده است و یا اگر به هر دلیلی به برنامهنویسی وب علاقهمند هستید، پیشنهاد میکنیم موارد و نکات مطرح شده در این مقاله را به دقت مطالعه کنید، چرا که چیزهای زیادی برای آموختن خواهید یافت.
اشتباه تایپی
« …و اعلان کردن (Declear) یک متغیر را به خوبی درک کنیم.»
Declare درسته.
با سلام و احترام؛
صمیمانه از همراهی شما با مجله فرادرس و ارائه بازخورد سپاسگزاریم.
این مورد اصلاح شد.
برای شما آرزوی سلامتی و موفقیت داریم.