Javascript-форум - передача this.

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - передача this. (https://javascript.ru/forum/misc/53192-peredacha.html)

передача this.

var obj = {
	value:1,
	fn: function() {

		(function(){
			this.value = 223;
		}).call(this);
	}
}

obj.fn();
console.log(obj.value)
var start = +new Date();

for(var i = 0; i < 2000000; i++) {
	obj.fn();
	if(i == 1999999) console.log(+new Date() -start)
}

call(this) быстрее чем передача this через переменную, в crhome на 100 мс.
apply медленнее на 200 за call.
bind медленнее всех больше чем 100 раз.

задаюсь вопросом почему в скриптах часто встречаю передачу через переменную that .

может я плохо проводил тесты , кому интересно попробуйте у себя и напишите как у вас

Цитата:

задаюсь вопросом почему в скриптах часто встречаю передачу через переменную that .

Как ты собираешься использовать call в ситуации с коллбеками?

Цитата:

Сообщение от caetus

fn: function() {
04

05
        (function(){
06
            this.value = 223;
07
        }).call(this);
08
    }

Цитата:

Сообщение от caetus

for(var i = 0; i < 2000000; i++) {
obj.fn();
if(i == 1999999) console.log(+new Date() -start)
}

в топку такие тесты, ты не передачу

Цитата:

Сообщение от caetus

call(this) быстрее чем передача this через переменную, в crhome на 100 мс.
apply медленнее на 200 за call.
bind медленнее всех больше чем 100 раз.

сравниваешь, а сравниваешь оптимизации хрома, поскольку при каждом вызове ты создаешь функцию какая оптимизируется движком хрома, либо не оптимизируется в зависимости от применяемого метода http://habrahabr.ru/post/154537/

Цитата:

а сравниваешь оптимизации хрома

В FF все точно так же.

var obj = {
	val: 1,
	fn: function (callback) {
		return callback.call(this);
	}
}

например так

в ie8 call медленнее на 100мс ,при затрате на вызов функции 2 ляма раз.

Цитата:

Сообщение от Erolast

В FF все точно так же.

написал же что сравнивает не передачу this а время создания и выполнения анонимной функции
различными методами, какие занимают разное время априори

Цитата:

Сообщение от dobryk

а сравниваешь оптимизации хрома, поскольку при каждом вызове ты создаешь функцию какая оптимизируется движком хрома, либо не оптимизируется в зависимости от применяемого метода

что тебе не ясно то из написанного?

а чтоб сравнивать передачу this:

Цитата:

Сообщение от caetus

16
obj.fn();

здесь нужно использовать call, apply или забинженую функцию

Цитата:

var obj = {
val: 1,
fn: function (callback) {
return callback.call(this);
}
}

например так

Что? Это аналогично простому вызову без call:

var obj = {
    val: 1,
    fn: function (callback) {
        return callback();
    }
}

Я имел в виду такое:

var storage = {
  getData: function() {
    var that = this;
    $.get("data.php", function(response) {
      that.data = response;
    }
  }
}

да тут никак не передать , я тебе говорю про код с замыканиям , часто передают this через переменную , как на меня передача через call более
читаемо !

Более читаемо - это использовать ES6.

var obj = {
  method() {
    (() => {
      var x = 10;
      console.log(this == obj); //true
    })();
    console.log(typeof x); //undefined
  }
}

Или даже так:

var obj = {
  method() {
    {
      let x = 10;
      console.log(this == obj); //true
    }
    console.log(typeof x); //undefined
  }
}

ну ES6 это конфетка , только я пишу на ES5 (((

Многое теряешь.
http://6to5.org/

caetus, that, _this, self, scope и т.д. – плохие названия.
Что мешает дать ссылке на this нормальное имя, такое, как если бы это была внешняя ссылка?

function Model() {}

Model.prototype.fetch = function () {
    var model = this;
    …
    xhr.onload = function () {
        …
        model.data = JSON.parse(xhr.responseText);
        …
    };
};


function View() {}

View.prototype.render = function (root) {
    var view = this;
    …
    window.requestAnimationFrame(function () {
        var html = view.template(view.model.data);
        root.insertAdjacentHTML('beforeend', html);
    });
};

that годится только для абстрактных примеров. Со всеми этими .call(this)/.bind(this) рефакторинг превратится в ад, когда тебе очередную часть кода нужно будет сделать асинхронной. Гоняться за миллисекундами стоит, если у тебя этот код выполняется действительно много раз, как в синтетических тестах.

Цитата:

Сообщение от Erolast

Многое теряешь.
http://6to5.org/

В идеальном мире все проекты, с которыми сталкиваешься, начинаешь писать сам, и все коллеги знают ES6, жаль мы не в таком мире.