Как использовать контекст в JavaScript?

Question

[Alex]

Три простых примера кода:
1. Создаем указатель на объект

var App = {
	// Свойство
	name: 'Alex',
	// Асинхронный метод
	asuncFunc: function () {
		var deferred = $.Deferred();

		setTimeout(function () {
			deferred.resolve();
		}, 5000);

		return deferred.promise();
	},
	// Обработчик (тут нужно обратится к свойству)
	say: function () {
		var app = this;
		app.asuncFunc().done(function () {
			console.log(this); // Deferred
			console.log(app.name);
		});
	}
}

2. Во втором варианте мы сохраняем контекст в обработчике

var App = {
	// Свойство
	name: 'Alex',
	// Асинхронный метод
	asuncFunc: function () {
		var deferred = $.Deferred();

		setTimeout($.proxy(deferred, 'resolveWith', this), 5000);

		return deferred.promise();
	},
	// Обработчик (тут нужно обратится к свойству)
	say: function () {
		this.asuncFunc().done(function () {
			console.log(this); // App
			console.log(this.name);
		});
	}
}

3. Используем глобальный объект (при условии что он один и не дублируется)

var App = {
	// Свойство
	name: 'Alex',
	// Асинхронный метод
	asuncFunc: function () {
		var deferred = $.Deferred();

		setTimeout(function () {
			deferred.resolve();
		}, 5000);

		return deferred.promise();
	},
	// Обработчик (тут нужно обратится к свойству)
	say: function () {
		App.asuncFunc().done(function () {
			console.log(this); // Deferred
			console.log(App.name);
		});
	}
}

Какой из трех вариантов работы с контекстом наиболее правильный? Какие особенности в плане производительности и т.д.?

Comments

[vasIvas]

не один вариант не правилен. один объект не может и хранить данные и обрабатывать их. А померить скорость... сами мерите, а если не умеете, то учитесь..

[Alex]

vasIvas: а почему не может хранить и обрабатывать?

[vasIvas]

Александр Козак: ну чтобы о Вас сказали если бы Вы были и мальчик и девочка одновременно?

[Дмитрий Беляев]

vasIvas:
>> один объект не может и хранить данные и обрабатывать их
кто это сказал такую глупость?
вся прелесть js в том, что я могу по собственному усмотрению использовать или singlton
как у автора или инициировать много схожих объектов через прототипы

[vasIvas]

Дмитрий Беляев: и как эта прелесть называется, говнокод?

[Дмитрий Беляев]

vasIvas: Singlton
и естественно если таких объектов хотя бы 2, то singlton не уместен, нужны прототипы

[vasIvas]

Дмитрий Беляев: идите почитайте что такое синглтон и потом ещё сто раз прочтите что написал я.

Answer 1

[Виталий Инчин ☢]

Никаких различий в плане производительности нет. Использовать или не использовать this - дело ваше. Если планируете делать так:

var FuncObj = {
  f1 : function(){
      console.log(this);
  }
}

FuncObj.f1(); //FuncObj

var copyF1 = FuncObj.f1;
copyF1(); //window

То, само собой, нужно использовать не контекст, а неизменную ссылку на объект. И лучше так:

var FuncObj = (function(FO){

 return FO = {
    f1 : function(){
       console.log(FO.data);
    },
    data : "8 800 555 3535"
 }

})();

var copyF1 = FuncObj.f1;
copyF1(); //FuncObj.data

Как правило, this полезен только при конструировании объектов, а у вас будет просто небольшая кучка, независимых от вне, статических методов...

Comments

[Alex]

А чем второй вариант лучше?

[Виталий Инчин ☢]

Александр Козак: ну так тем, что появляется возможность сохранить ссылку на функцию в переменную и работать с ней.

Answer 2

[Дмитрий Беляев]

С точки зрения производительности все 3 примера одинаковы.
А вот данные в глобале это очень плохо для отладки и поддержки кода. по крайней мере, когда они уж так необходимы, нужно везде в коде указывать их через глобальный объект (в браузере это windows), т.е. window.App js то оно пофигу, хотя и тут есть исключение, а вот программистам нет.