რა არის დამოკიდებული `this`-ის შესრულების კონტექსტის მნიშვნელობაზე JavaScript-ში?
sobes.tech AI
პასუხი AI-სგან
JavaScript-те this-дин мааниси функцияны чакыруу ыкмасына жараша болот. Негизги сценарийлер:
-
Глобалдык контекст: Функциялардан тышкары, катуу режимде (
'use strict')thisundefinedболот. Катуу режимсиз — глобалдык объект (windowбраузерде,globalNode.jsте). -
Объекттин методу чакыруу:
thisчакырылган методго тиешелүү объектти көрсөтөт.const obj = { prop: 'маани', method: function() { // this === obj console.log(this.prop); } }; obj.method(); -
Жөнөкөй функция чакыруу: Катуу режимде
thisundefined. Катуу режимсиз — глобалдык объект.function myFunction() { // катуу режимде this === undefined // режимсиз this === window (браузерде) console.log(this); } myFunction(); -
Курулушчу (
new):newоператору менен чакырганда, функциянын ичиндеthisжаңы түзүлүп жаткан объектке шилтеме кылат.function MyClass(name) { this.name = name; // this === жаңы объект } const instance = new MyClass('тест'); // instance.name === 'тест' -
Ачык байланыштыруу (
call,apply,bind): Бул ыкмалар функциянынthisмаанисин ачык аныктоого мүмкүндүк берет.call(thisArg, arg1, arg2, ...): функцияны чакырып,this-тиthisArgкылып коюп, аргументтерди жеке өткөрөт.apply(thisArg, [argsArray]): функцияны чакырып,this-тиthisArgкылып коюп, аргументтерди массив түрүндө өткөрөт.bind(thisArg): жаңы функцияны кайтарат, анынthisтуташтырылган бойдон калат.
const anotherObj = { value: 42 }; function showValue() { console.log(this.value); } showValue.call(anotherObj); // Чыгуу: 42 -
Ништүү функциялар (
=>): Ништүү функциялар өзүнүнthis-и жок.thisмааниси лексикалык контексттен мурас алат.const outerObj = { name: 'Чыгуу', method: function() { const arrowFunc = () => { // this бул жерде outerObj `method` аркылуу алынган console.log(this.name); }; arrowFunc(); } }; outerObj.method(); // Чыгуу const anotherArrowFunc = () => { // this бул жерде глобалдык контексттен мурас алган (же `undefined` катуу режимде) console.log(this); }; anotherArrowFunc(); -
DOMдогу окуя иштетгичтери: Көп учурда,
thisDOM элементине шилтеме кылат, анда окуя болгон.// Браузерде мисал const button = document.querySelector('button'); button.addEventListener('click', function() { // this === button console.log(this.tagName); });
Бул механизмдерди түшүнүү JavaScriptте this-ти туура колдонуу үчүн маанилүү.