referencje, closure, this
Bartosz Szczeciński
16.05.2018
@btmpl
medium.com/@baphemot
Zakres zmiennych
var test = 1;
var test = 2;
var test = 3;
test = 4;
test = 5;
console.log(test);
5
Zakres zmiennych
var test = 1;
function testFunction() {
console.log('testFunction', test);
}
console.log('global', test);
testFunction();
console.log('global', test);
global 1
testFunction 1
global 1
Zakres zmiennych
var test = 1;
function testFunction() {
var test = 2;
console.log('testFunction', test);
}
console.log('global', test);
testFunction();
console.log('global', test);
global 1
testFunction 2
global 1
Zakres zmiennych
var test = 1;
function testFunction() {
test = 2;
console.log('testFunction', test);
}
console.log('global', test);
testFunction();
console.log('global', test);
global 1
testFunction 2
global 2
Jeżeli pominiemy var przy odczycie, parser sprawdzi czy zmienna jest już zadeklarowana, jeżeli nie, sprawdzi w zakresie wyżej (w tym przypadku - window)
Jeżeli pominiemy specyfikator var przy zapisie parser uznaje, że zmienna została już zadeklarowała i "szuka jej". Jeżeli nie znajdzie jej w zakresie, szuka jej w zakresie wyżej. Jeżeli nie znajdzie, tworzy lub zmienia na zakresie globalnym window.
Zakres zmiennych
var test = 1;
function testFunction() {
var test = 2;
console.log('testFunction', test);
}
console.log('global', test);
setTimeout(testFunction, 1000);
console.log('global', test);
global 1
global 1
testFunction 2
Zakres zmiennych
console.clear();
var test = 1;
function testFunction() {
console.log('testFunction', test);
}
console.log('global', test);
setTimeout(testFunction, 1000);
console.log('global', test);
global 1
global 1
testFunction 1
Zakres zmiennych
console.clear();
var test = 1;
function testFunction() {
console.log('testFunction', test);
}
console.log('global', test);
setTimeout(testFunction, 1000);
console.log('global', test);
test = 5;
global 1
global 1
testFunction 5
Zakres zmiennych
console.clear();
var test = 1;
console.log('global', test);
function zrobZakres() {
var mojaZmienna = test;
function testFunction() {
console.log('testFunction', mojaZmienna);
}
setTimeout(testFunction, 1000);
}
zrobZakres();
console.log('global', test);
test = 5;
global 1
global 1
testFunction 1
Zakres zmiennych
console.clear();
var test = 1;
console.log('global', test);
(function() {
var mojaZmienna = test;
function testFunction() {
console.log('testFunction', mojaZmienna);
}
setTimeout(testFunction, 1000);
})();
console.log('global', test);
test = 5;
global 1
global 1
testFunction 1
Przypisanie this
var person = {
imie: 'Bartek',
getName: function() {
console.log(this.imie);
}
}
person.getName();
Bartek
Przypisanie this
var person = {
imie: 'Bartek',
getName: function() {
console.log(this.imie);
}
}
person.getName.call();
undefined
Funkcje .call i .apply jako pierwszy parametr przekazują this do wywoływanej funkcji. Jeżeli go nie przekażemy, podstawiony zostanie this z momentu wywołania (window)
Przypisanie this
var imie = 'Bartosz';
var person = {
imie: 'Bartek',
getName: function() {
console.log(this.imie);
}
}
person.getName.call();
Bartosz
Istnieje window.imie, więc window podstawione jako this posiada zmienną this.imie
Przypisanie this
var person = {
imie: 'Bartek',
getName: function() {
console.log(this.imie);
}
}
person.getName.call(person);
Bartek
Przypisanie this
var person = {
imie: 'Bartek',
getName: function() {
console.log(this.imie);
}
}
var kopiaFunkcji = person.getName;
kopiaFunkcji();
undefined
Funkcja kopiowana jest przez referencję, co w praktyce oznacza "wykonaj kopię ciała funkcji"
Przypisanie this
var person = {
imie: 'Bartek',
getName: function() {
console.log(this.imie);
}
}
var otherPerson = {
imie: 'Marcin'
}
var kopiaFunkcji = person.getName;
kopiaFunkcji.call(otherPerson);
Marcin
Przypisanie this
var person = {
imie: 'Bartek',
getName: function() {
console.log(this.imie);
}
}
setTimeout(person.getName, 1000);
undefined
Przypisanie this
var person = {
imie: 'Bartek',
getName: function() {
console.log(this.imie);
}
}
setTimeout(person.getName.bind(person), 1000);
Bartek
.bind pozwala na trwałe przypisanie jakie this powinno zostać przekazane do funkcji
referencje, closure, this
By btmpl
referencje, closure, this
- 473