English Русский

Ներածություն գործառույթներին JavaScript-ում

Որոնք են գործառույթները:

Ծրագրավորման գործառույթները, մասնավորապես JavaScript-ում, հիմնարար շինարարական բլոկներ են, որոնք թույլ են տալիս ընդգրկել բազմակի օգտագործման կոդ, որը նախատեսված է որոշակի առաջադրանք կատարելու համար: Ֆունկցիայի ներսում հրահանգների մի շարք սահմանելով՝ դուք կարող եք կատարել այդ հրահանգները, երբ և որտեղ կանչվի ֆունկցիան՝ առանց ամեն անգամ կոդը վերաշարադրելու անհրաժեշտության:

Գործառույթները մեծացնում են կոդի մոդուլյարությունը, ընթեռնելիությունը և պահպանելիությունը: Դրանք թույլ են տալիս բարդ խնդիրները բաժանել ավելի փոքր, ավելի կառավարելի առաջադրանքների, որոնցից յուրաքանչյուրը ներառված է իր գործառույթի մեջ: Սա ոչ միայն հեշտացնում է զարգացման գործընթացը, այլև հեշտացնում է վրիպազերծումը և փորձարկումը, քանի որ յուրաքանչյուր գործառույթ կարող է ինքնուրույն փորձարկվել և ստուգվել:

Գործառույթների հայտարարում

JavaScript-ում դուք հայտարարում եք ֆունկցիա՝ օգտագործելով functionհիմնաբառը, որին հաջորդում է ֆունկցիան նույնականացնող անունը: Ֆունկցիայի անվանմանը հաջորդում են փակագծերը, որոնք կարող են ներառել այնպիսի պարամետրեր, որոնք ներկայացնում են այն մուտքերը, որոնց վրա գործում է ֆունկցիան: Վերջապես, ֆունկցիայի մարմինը փակված է գանգուր փակագծերի մեջ, որը պարունակում է գործարկվող կոդի բլոկ:

                    
function sayHello() {
    console.log("Hello, world!");
}

Այս օրինակում sayHelloֆունկցիան է, որը ոչ մի պարամետր չի ընդունում և, երբ կանչվում է, կգործարկի կոդը իր մարմնի ներսում՝ տպելով «Բարև, աշխարհ»: կոնսոլին։

Եթե ​​ցանկանում եք, որ ֆունկցիան ընդունի մուտքերը, կարող եք նշել պարամետրերը փակագծերում.

                    
function greet(name) {
    console.log("Hello, " + name + "!");
}

Ահա greetմի ֆունկցիա, որը վերցնում է մեկ պարամետր, nameև այն օգտագործում է ֆունկցիայի ներսում՝ անհատականացված ողջույնը ցուցադրելու համար:

Զանգահարելու (կանչելու) գործառույթներ

Գործառույթն իրականացնելու համար դուք կանչում կամ կանչում եք այն՝ օգտագործելով նրա անունը, որին հաջորդում են փակագծերը: Եթե ​​ֆունկցիան պահանջում է պարամետրեր, դուք արգումենտները տրամադրում եք այս փակագծերում. հակառակ դեպքում, դուք պարզապես օգտագործում եք դատարկ փակագծեր:

                    
sayHello(); // Calls the sayHello function, outputting "Hello, world!"

greet("Alice"); // Calls the greet function with "Alice" as an argument, outputting "Hello, Alice!"

Երբ դուք կանչում եք ֆունկցիա, JavaScript շարժիչը ցատկում է դեպի ֆունկցիայի հռչակագիրը, կատարում է կոդի բլոկը դրա ներսում, և այնուհետև վերադառնում է կոդի այն կետը, որտեղ կանչվել է ֆունկցիան՝ այնտեղից շարունակելով կատարումը:

Վերոնշյալ օրինակներում sayHello()կանչվում է առանց որևէ արգումենտի, քանի որ այն չի պահանջում, մինչդեռ greet("Alice")կոչվում է մեկ արգումենտով՝ «Alice» անունը ֆունկցիային փոխանցելու համար՝ ցույց տալով, թե ինչպես կարող են ֆունկցիաները օգտագործել և առանց պարամետրերի մոդուլյարացնելու և կառավարելու համար։ ծրագրի ընթացքը.

Պարամետրեր և վերադարձի արժեքներ ֆունկցիաներում

Ֆունկցիայի պարամետրեր

Գործառույթների պարամետրերը նման են արժեքների տեղապահների, որոնք կարող եք փոխանցել ֆունկցիային, երբ այն կանչեք: Այս արժեքներն այնուհետև օգտագործվում են ֆունկցիայի շրջանակներում՝ գործողություններ կամ հաշվարկներ կատարելու համար: Պարամետրերը թույլ են տալիս գործառույթներին ավելի դինամիկ և վերօգտագործելի լինել, քանի որ դրանք կարող են աշխատել տարբեր տվյալների վրա ամեն անգամ, երբ դրանք կանչվում են:

Ֆունկցիան հայտարարելիս դուք նշում եք պարամետրերը փակագծերի ներսում՝ հետևելով ֆունկցիայի անվանմանը: Յուրաքանչյուր պարամետր գործառույթի ներսում գործում է որպես տեղական փոփոխական:

Բազմաթիվ պարամետրերով ֆունկցիայի օրինակ.

                    
function addNumbers(number1, number2) {
    return number1 + number2;
}

Այս օրինակում addNumbersերկու պարամետրով ֆունկցիա է number1և number2. Երբ ֆունկցիան կանչվում է, այն գումարում է այս երկու թվերը և վերադարձնում արդյունքը։

Վերադարձի արժեքներ

returnՖունկցիայի հայտարարությունը վերադարձնում է արժեք այն տեղը, որտեղ կանչվել է ֆունկցիան : Սա թույլ է տալիս ֆունկցիան հետ փոխանցել տվյալները ծրագրի մնացած մասերին: Երբ returnկատարվում է, ֆունկցիայի կատարումն ավարտվում է, և նշված արժեքը վերադարձվում է զանգահարողին:

Արժեքը վերադարձնելու օրինակ.

                    
function multiplyNumbers(num1, num2) {
    return num1 * num2;
}

let result = multiplyNumbers(5, 3); // result is now 15

Այս օրինակում multiplyNumbersհաշվարկում է արդյունքը num1և num2վերադարձնում արդյունքը: Այնուհետև վերադարձված արժեքը պահվում է փոփոխականում result:

Գործնական վարժություններ

Պարամետրերի և վերադարձի արժեքների հասկացություններն ամրապնդելու համար եկեք աշխատենք մի քանի գործնական վարժությունների միջոցով.

  1. Հաշվեք ձևի մակերեսը. գրեք ուղղանկյան մակերեսը հաշվարկելու գործառույթ, որը որպես պարամետրեր պահանջում է լայնություն և բարձրություն:

                        
function calculateArea(width, height) {
    return width * height;
}

let area = calculateArea(5, 10); // Calls the function and stores the result

console.log("Area of the rectangle:", area);

  2. Միավորել տողերը. Ստեղծեք ֆունկցիա, որն ընդունում է երկու տող որպես պարամետր և վերադարձնում դրանց միացումը:

                        
function concatenateStrings(str1, str2) {
    return str1 + str2;
}

let fullName = concatenateStrings("Alice", " Smith");

console.log("Full Name:", fullName);

  3. Փոխակերպել ջերմաստիճանի միավորները. մշակել ֆունկցիա՝ Ցելսիուսը Ֆարենհայթի փոխարկելու համար: Փոխակերպման բանաձևն է (Celsius * 9/5) + 32.

                        
function celsiusToFahrenheit(celsius) {
    return (celsius * 9 / 5) + 32;
}

let fahrenheit = celsiusToFahrenheit(30); // Converts 30°C to °F

console.log("30°C in Fahrenheit is:", fahrenheit);

Այս վարժություններն առաջարկում են գործնական փորձ՝ գործառույթների սահմանման, դրանց մեջ տվյալների փոխանցման պարամետրերի կիրառման և returnտվյալների փոխանցման համար հայտարարություն օգտագործելու համար: Այս գործողությունների միջոցով ուսանողները կսովորեն, թե ինչպես ստեղծել ֆունկցիոնալ, բազմակի օգտագործման կոդային բլոկներ, որոնք կարող են կատարել մի շարք առաջադրանքներ JavaScript ծրագրում:

Հասկանալով շրջանակը JavaScript-ում

Համաշխարհային ընդդեմ տեղական շրջանակի

Scope-ը JavaScript-ում վերաբերում է փոփոխականների և գործառույթների հասանելիությանը ծրագրի տարբեր մասերում: Դա հիմնարար հասկացություն է, որը որոշում է, թե որտեղ կարող է փոփոխականին մուտք գործել կոդի մեջ:

  • Համաշխարհային շրջանակ. փոփոխականն ունի գլոբալ շրջանակ, երբ այն հայտարարվում է որևէ ֆունկցիայից դուրս: Սա նշանակում է, որ այն կարող է մուտք գործել և փոփոխվել ծրագրի ցանկացած մասից, ներառյալ գործառույթների ներսում:

                            
let globalVar = "I am global";

function accessGlobalVar() {
    console.log(globalVar);  // Accessible here
}

console.log(globalVar);  // Also accessible here

    Այս օրինակում globalVarսահմանվում է ցանկացած ֆունկցիայից դուրս՝ այն դարձնելով գլոբալ հասանելի:

  • Տեղական շրջանակ (կամ ֆունկցիայի շրջանակ). փոփոխականն ունի լոկալ տիրույթ, երբ այն հայտարարվում է ֆունկցիայի շրջանակներում: Այն կարող է մուտք գործել և փոփոխվել միայն այդ ֆունկցիայի շրջանակներում, այլ ոչ թե դրանից դուրս:

                            
function myFunction() {
    let localVar = "I am local";
    console.log(localVar);  // Accessible here
}

// console.log(localVar);  // Unaccessible here, would result in an error

    Այստեղ localVarսահմանվում է ներսում myFunctionև հասանելի է միայն իր որոշիչ ֆունկցիայի շրջանակներում:

Շրջանակի շղթա

JavaScript-ի շրջանակի շղթան վերաբերում է նրան, թե ինչպես են ներկառուցված գործառույթները կարող մուտք գործել փոփոխականներ: Ներքին ֆունկցիաների կառուցվածքում ներքին ֆունկցիաները կարող են մուտք գործել փոփոխականներ իրենց մայր ֆունկցիայի շրջանակից՝ ձևավորելով հասանելի շրջանակների «շղթա»՝ ներքինից արտաքին:

                    
function outerFunction() {
    let outerVar = "Outer variable";

    function innerFunction() {
        let innerVar = "Inner variable";
        console.log(outerVar);  // Accessible due to scope chain
        console.log(innerVar);  // Accessible in its local scope
    }

    innerFunction();
    // console.log(innerVar);  // Unaccessible here, would result in an error
}

outerFunction();

Այս կառույցում innerFunctionկարող է մուտք գործել outerVarըստ outerFunctionշրջանակի շղթայի, մինչդեռ outerVarմնում է անհասանելի իր որոշիչ գործառույթից դուրս:

Ձեռքի վարժություն

Շրջանակի հայեցակարգը և ինչպես է այն ազդում փոփոխական հասանելիության և կյանքի տևողության վրա պատկերացնելու համար, ուսանողները կարող են մասնակցել մի վարժություն, որը ներառում է ներդիր գործառույթներ.

  1. Ստեղծեք Nested գործառույթներ.

    Սահմանեք ֆունկցիա մեկ այլ ֆունկցիայի մեջ՝ յուրաքանչյուրն իր տեղական փոփոխականներով, և փորձեք մուտք գործել այդ փոփոխականները ծրագրի տարբեր մասերից։

                        
function parentFunction() {
    let parentVar = "Parent variable";

    function childFunction() {
        let childVar = "Child variable";
        console.log(parentVar);  // Accessible here
        console.log(childVar);  // Accessible here
    }

    childFunction();
    // console.log(childVar);  // Error: childVar is not defined in this scope
}

parentFunction();
// console.log(parentVar);  // Error: parentVar is not defined in this scope

  2. Փորձարկել Scope Accessibility.

    Ներդրված գործառույթները սահմանելուց հետո փորձեք մուտք գործել ներքին ֆունկցիայի փոփոխականներ արտաքին ֆունկցիայից և հակառակը՝ տեսնելու, թե որտեղ են սխալները տեղի ունենում շրջանակի սահմանափակումների պատճառով:

Այս վարժությունն օգնում է ուսանողներին հասկանալ, թե ինչպես է աշխատում շրջանակի շղթան JavaScript-ում՝ ցույց տալով փոփոխական հասանելիությունը կարգավորող կանոնները ներդիր գործառույթների շրջանակներում և ընդգծելով տեղական և գլոբալ շրջանակի հայեցակարգը: Այս գործողությունների միջոցով սովորողները գործնական պատկերացումներ են ձեռք բերում իրենց ծածկագրի կառուցվածքի վերաբերյալ՝ փոփոխական հասանելիությունը կառավարելու և պատշաճ ամփոփում ապահովելու համար:

Փակումներ և սլաքների գործառույթներ JavaScript-ում

Փակումներ

JavaScript-ում փակումը հզոր և հիմնարար հասկացություն է, որտեղ ներքին ֆունկցիան հասանելի է իր արտաքին ֆունկցիայի փոփոխականներին և պարամետրերին, նույնիսկ այն բանից հետո, երբ արտաքին ֆունկցիան ավարտի իր կատարումը: Այս հնարավորությունը փակումները դարձնում է կարևոր գործիք վերահսկվող միջավայրում վիճակը կառավարելու և պահպանելու համար:

Փակման հիմնական բնութագրերը.

  • Մուտք դեպի արտաքին ֆունկցիայի շրջանակ. Ներքին գործառույթները կարող են մուտք գործել արտաքին ֆունկցիայի մեջ սահմանված փոփոխականներ և պարամետրեր:
  • Հիշողության պահպանում. նույնիսկ արտաքին ֆունկցիան կատարելուց հետո, ներքին ֆունկցիան պահպանում է մուտքը դեպի արտաքին ֆունկցիայի շրջանակը՝ պահպանելով վիճակը:
  • Գաղտնիություն. Փակումները կարող են ստեղծել մասնավոր փոփոխականներ և մեթոդներ, որոնք հասանելի են միայն գործառույթի շրջանակում՝ կանխելով արտաքին մուտքն ու փոփոխությունը:

Փակման օրինակ.

                    
function outerFunction() {
    let secretNumber = 42; // Private variable

    return function innerFunction() {
        console.log(`The secret number is ${secretNumber}.`);
    };
}

let getSecretNumber = outerFunction(); // Creates a closure
getSecretNumber(); // Accesses secretNumber via closure

Այս օրինակում secretNumberմասնավոր փոփոխական է outerFunction. innerFunctionձևավորում է փակում՝ պահպանելով մուտքը secretNumberնույնիսկ outerFunctionայն գործարկվելուց հետո:

Սլաքների գործառույթները

Սլաքների գործառույթները, որոնք ներկայացված են ECMAScript 6-ում (ES6), ապահովում են ավելի հակիրճ շարահյուսություն ֆունկցիաները գրելու համար: Դրանք հատկապես օգտակար են կարճ արտահայտությունների համար և սովորաբար օգտագործվում են ֆունկցիոնալ ծրագրավորման օրինաչափություններում և մեթոդներում, որոնք պահանջում են այս համատեքստը, ինչպիսիք են իրադարձությունների մշակողները և հետադարձ զանգերը:

Սլաքների ֆունկցիաների շարահյուսություն և բնութագրեր.

  • Համառոտ շարահյուսություն. սլաքների գործառույթները վերացնում են հիմնաբառի անհրաժեշտությունը functionև օգտագործում են =>ֆունկցիայի մարմնից պարամետրերը առանձնացնելու համար:
  • Լեքսիկական thisկապում. Ի տարբերություն ավանդական ֆունկցիաների, սլաքների ֆունկցիաները չունեն իրենց սեփական thisենթատեքստը: Փոխարենը, նրանք ժառանգում են thisշրջակա ծածկագրից, որը հայտնի է որպես բառապաշարի շրջանակ:
  • Առանց argumentsօբյեկտի. սլաքների ֆունկցիաները օբյեկտ չունեն arguments: Պարամետրերը փոխանցվում են հստակորեն, կամ ...restպարամետրը կարող է օգտագործվել փաստարկներ հավաքելու համար:

Սլաքի ֆունկցիայի օրինակ.

                    
let addNumbers = (a, b) => a + b;
console.log(addNumbers(5, 3)); // Outputs 8

Այս սլաքի ֆունկցիայում addNumbersերկու թվեր ավելացնում է ավելի հակիրճ ձևով, քան ավանդական ֆունկցիայի արտահայտությունը:

Ինտերակտիվ վարժություն

Ավանդական գործառույթների վերագրանցում որպես սլաքների գործառույթներ.

Փոխակերպեք առկա ֆունկցիաների արտահայտությունները սլաքների ֆունկցիաների՝ հասկանալու շարահյուսության և վարքագծի տարբերությունները:

                    
// Traditional function expression
function sayHello(name) {
    return `Hello, ${name}!`;
}

// Converted to arrow function
let sayHello = name => `Hello, ${name}!`;

Պարզ փակման ստեղծում.

Ուղղորդեք ուսանողներին ստեղծել փակում, որը կառավարում է մասնավոր փոփոխականը, ցույց տալով, թե ինչպես կարող են փակումները ներառել վիճակը:

                    
function createCounter() {
    let count = 0; // Private variable

    return () => {
        count++;
        console.log(`Current count is ${count}`);
    };
}

let counter = createCounter(); // Closure encapsulating the count variable
counter(); // Increments and logs count
counter(); // Increments and logs count

Այս վարժությունում ուսանողները կսովորեն, թե ինչպես ավանդական ֆունկցիաները վերածել սլաքների ֆունկցիաների և ինչպես օգտագործել փակումները՝ գործառույթի շրջանակում վիճակը արդյունավետ կառավարելու և ամփոփելու համար: