JavaScript- ի սխալների 5 ընդհանուր պատճառներ (և ինչպես խուսափել դրանցից)

JavaScript- ը (JS) ամենատարածված, ճկուն և լայնորեն տարածված ծրագրավորման լեզու է, չնայած այն հակված է նաև սխալների և սխալների, որոնք մշակում են ծրագրավորողների մեծամասնությանը խոժոռել.


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

JavaScript- ի սխալները դիմումներին բերում են անսպասելի արդյունքներ և վնասում են օգտագործողի փորձին: Վերջերս ուսումնասիրություն Բրիտանական Կոլումբիայի համալսարանի (UBC) կողմից փորձել է պարզել JavaScript- ի սխալների և սխալների արմատական ​​պատճառներն ու ազդեցությունը: Ուսումնասիրության արդյունքները բացահայտեցին որոշ ընդհանուր օրինաչափություններ, որոնք խաթարում են JS ծրագրերի կատարումը.

Ահա կարկանդակ աղյուսակը, որը ցույց է տալիս հետազոտողների պարզածը

Բլոգի այս գրառման մեջ մենք կներկայացնենք ուսումնասիրության մեջ ընդգծված JavaScript- ի թերությունների մի քանի հիմնական պատճառները (գումարած մյուսները, որոնց ամեն օր հանդիպում ենք) և ինչպես ձեր դիմումները դարձնել ավելի քիչ հակված ձախողումների.

DOM- ի հետ կապված

Փաստաթղթի օբյեկտի մոդելը (DOM) կարևոր դեր է խաղում կայքերի փոխգործակցության մեջ: DOM ինտերֆեյսը հնարավորություն է տալիս շահագործել վեբ էջի բովանդակությունը, ոճը և կառուցվածքը: Պարզ HTML վեբ էջերը ինտերակտիվ դարձնելը կամ DOM manip շահագործելը դա է պատճառը, որ թողարկվել է JavaScript ծրագրավորման լեզուն:.

Այսպիսով, նույնիսկ Node.js- ի պես թեքնված JavaScript տեխնոլոգիաների ներդրմամբ, DOM- ի հետ աշխատելը դեռևս կազմում է լեզուների կատարածի մեծ մասը: Հետևաբար, DOM- ը նշանակալի պողոտա է JavaScript ծրագրերում առկա սխալներն ու սխալները ներկայացնելու համար.

Զարմանալի չէ, որ JavaScript- ի սխալի մասին զեկույցի ուսումնասիրությունը պարզեց, որ DOM- ի հետ կապված հարցերը պատասխանատու են թերությունների մեծ մասի համար ՝ 68%:.

Օրինակ ՝ JavaScript- ի որոշ ծրագրավորողներ սովորաբար սխալ են անում DOM- ի տարրը վերբեռնելուց առաջ հղում կատարելու համար ՝ հանգեցնելով կոդերի սխալների.

document.getElementById ("բեռնարկղ") .innerHTML = "Ընդհանուր JS սխալներ և սխալներ";

Եթե ​​վերը նշված ծածկագիրը գործարկված է Chrome զննարկիչում, այն սխալ է նետելու, որը կարելի է տեսնել մշակողի վահանակում.

Սխալը նետվում է այն պատճառով, որ JavaScript- ի ծածկագիրը սովորաբար կատարվում է այն փաստաթղթի վրա, որը երևում է: Որպես այդպիսին, զննարկիչը տեղյակ չէ նշված տարրից, երբ կոդն աշխատում է.

Նման խնդիրը լուծելու համար կարող եք օգտագործել տարբեր մոտեցումներ: Ամենապարզ մեթոդը սցենարի պիտակի նախքան սկիզբը դնելն է: Կարող եք նաև օգտագործել jSuery- ի նման JavaScript գրադարան, որպեսզի համոզվեք, որ DOM- ը բեռնված է նախևառաջ դրա հասանելիությունը:.

document.getElementById ("բեռնարկղ") .innerHTML = "Ընդհանուր JS սխալներ և սխալներ";

Սինթաքսի վրա հիմնված

Սինտաքսի սխալները տեղի են ունենում այն ​​ժամանակ, երբ JavaScript- ի թարգմանիչը չի կարողանում կատարել սինթակտիկորեն սխալ կոդ: Եթե ​​դիմում ստեղծելիս, և թարգմանիչը դիտարկի այն նշաններ, որոնք չեն համընկնում JavaScript ծրագրավորման լեզվի ստանդարտ շարահյուսության հետ, դա սխալ է նետելու: JavaScript- ի սխալի մասին զեկույցի ուսումնասիրության համաձայն, նման սխալները պատասխանատու են լեզվի բոլոր սխալների 12% -ի համար.

Քերականական սխալները, ինչպիսիք են փակ փակագծերը կամ չհամընկնող փակագծերը, JavaScript- ի շարահյուսական սխալների հիմնական պատճառն են:.

Օրինակ, երբ դուք պետք է օգտագործեք պայմանական հայտարարություններ բազմաթիվ պայմանների լուծման համար, գուցե կարոտեք անհրաժեշտության դեպքում փակագծեր տրամադրելը, ինչը հանգեցնում է շարահյուսական թերությունների:.

Եկեք դիտենք հետևյալ օրինակը.

եթե ((x > յ) && (յ) < 77) {
// այստեղ ավելի շատ կոդ
}

Այո, պայմանական հայտարարության վերջին փակագծերը բացակայում են: Դուք նկատել եք վերը նշված կոդի հետ կապված սխալը?

Եկեք ուղղենք դա.

եթե ((x > յ) && (յ) < 77)) {
// այստեղ ավելի շատ կոդ
}

Նման շարահյուսական սխալներից խուսափելու համար պետք է ժամանակ ծախսել JavaScript ծրագրավորման լեզվի քերականական կանոնների ուսման վրա: Ծածկագրման լայն պրակտիկայով դուք կարող եք հեշտությամբ նկատել քերականական սխալները և խուսափել դրանք առաքել ձեր մշակված կիրառմամբ.

Չճշտված / զրոյական հիմնաբառերի ոչ պատշաճ օգտագործումը

JavaScript- ի որոշ մշակողներ չգիտեն, թե ինչպես օգտագործել դրանք չսահմանված և դատարկ հիմնաբառեր ճիշտ: Փաստորեն, ուսումնասիրությունը փաստեց, որ հիմնաբառերի ոչ պատշաճ օգտագործումը կազմում է JavaScript- ի բոլոր վրիպակների 5% -ը.

The դատարկ Հիմնաբառը նշանակման արժեք է, որը սովորաբար նշանակվում է փոփոխականի ՝ գոյություն չունեցող արժեք նշելու համար: Զարմանալի է, դատարկ նաև JavaScript օբյեկտ է.

Ահա մի օրինակ.

var codeJS = անվավեր;

console.log (ծածկագիրJS);
// ելքը զրոյական է

console.log (typof codeJS);
// ելքը օբյեկտ է

Մյուս կողմից, չսահմանված ցույց է տալիս, որ փոփոխական կամ ցանկացած այլ գույք, որն արդեն հայտարարվել է, չունի նշանակված արժեք: Կարող է նաև ենթադրել, որ ոչինչ չի հայտարարվել. չսահմանված ինքնին տեսակ է.

Ահա մի օրինակ.

var codeJS;

console.log (ծածկագիրJS);
// ելքը սահմանված չէ

console.log (typof codeJS);
// ելքը սահմանված չէ

Հետաքրքիր է, որ եթե հավասարության օպերատորը և ինքնության օպերատորն օգտագործվում են համեմատելու համար դատարկ և չսահմանված հիմնաբառեր, վերջինս դրանք հավասար չի համարում.

console.log (null == undefined);
// ելքը ճիշտ է

console.log (null === undefined);
// ելքը կեղծ է

Հետևաբար, իմանալով դրա ճիշտ օգտագործումը դատարկ և չսահմանված հիմնաբառերը կարող են օգնել ձեզ ՝ ձեր JavaScript ծրագրերում վրիպակներ մտցնելուց խուսափելու համար.

Չճշտված մեթոդներ

JavaScript- ի վրիպակների ևս մեկ ընդհանուր պատճառն այն է, որ կանչեք մեթոդին ՝ առանց դրա նախնական բնութագրման: UBC- ի հետազոտողները պարզել են, որ այս սխալը բերում է JavaScript- ի բոլոր սխալների 4% -ը.

Ահա մի օրինակ.

var կոդեր = {
Անուն: "Պիտեր",
տարիքը ՝ 27,
խոսել ()
console.log (this.name);
}
;
coder.speakNow ();

Ահա այն սխալը, որը երևում է Chrome մշակողի վահանակում.

Վերոնշյալ սխալը տեղի է ունենում այն ​​պատճառով, որ կոչված գործառույթը ՝ TalkNow (), JavaScript ծածկագրում սահմանված չէ.

Վերադարձի հայտարարության ոչ պատշաճ օգտագործումը

JavaScript- ում, վերադառնալ հայտարարությունն օգտագործվում է գործառույթի գործողության դադարեցման համար, որպեսզի դրա արժեքը կարողանա դուրս գալ: Սխալ օգտագործման դեպքում վերադարձման հայտարարությունը կարող է խաթարել դիմումների օպտիմալ կատարումը: Ուսումնասիրության համաձայն, վերադարձի հայտարարության սխալ օգտագործումը հանգեցնում է JavaScript հավելվածների բոլոր վրիպակների 2% -ին.

Օրինակ ՝ JavaScript- ի որոշ ծրագրավորողներ սովորաբար սխալ են անում վերադարձման հայտարարությունը սխալ խախտելու մեջ.

Չնայած դուք կարող եք երկու տողով ջարդել JavaScript- ի հայտարարությունը և դեռ ստանալ անհրաժեշտ արդյունքը, վերադարձի հայտարարությունը խախտելը աղետ է հրավիրում ձեր դիմումին.

Ահա մի օրինակ.

գործառույթի համարը (n)
var ավելացնել = 5;
վերադարձ;
n + ավելացնել;
}
console.log (համարը (10));

Երբ վերը նշված ծածկագիրը գործարկված է, Chrome- ի մշակողի վահանակում անորոշ սահմանված սխալ է երևում.

Հետևաբար, դուք պետք է զերծ մնաք կոտրելուց վերադառնալ հայտարարություններ ձեր JavaScript կոդով.

Եզրակացություն

Հաճախորդների կողմից JavaScript ծրագրավորման լեզուն հիանալի ընդարձակ հնարավորություններ ունի ժամանակակից վեբ հավելվածների գործառույթներն ապահովելու համար: Այնուամենայնիվ, եթե դուք չեք հասկանում այն ​​հարցաթերթերը, որոնք ստիպում են լեզուն աշխատել, ձեր դիմումների կատարումը կարող է գաղտնազերծվել.

Ավելին, JavaScript- ի մշակողները պահանջում են բազմակողմանի գործիքներ `իրենց դիմումների կատարման խնդիրները լուծելու համար, և սխալներն ու սխալներն արագ հայտնաբերելու համար.

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

Երջանիկ սխալ JavaScript ծրագրավորում!

Հոդվածը գրել է Ալֆրիկ Օպիդին

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map