Видимость свойств объекта из внутренних функций
Сведу суть своей проблемы к обобщенно-наглядному примеру. Описываю я такой вот класс:
function myImages(){
this.images = new Array();
this.add_img = function(){
/*
тут идет кусок кода, где я добавляю в документ картинку,
получаю ее node, и дальнейшие действия выполняю только
по окончанию ее загрузки
*/
node.onload = function(){
/*
тут кусок кода, где я из уже загруженной картинки считываю высоту,
ширину и пр. необходимые мне параметры...
И вот тут мне надо в this.images запушить объект с собранными свойствами.
*/
this.images.push(obj)
}
}
}
Собственно вотъ. Естественно this.images не сработает, потому что в этом месте this является ссылкой на саму картинку, а не на свойство объекта. Я понимаю почему я из этой функции не могу увидеть this.images, но я не понимаю как мне обойти это? Как мне подняться в область видимости на уровень выше? Или может я изначально не правильно построил структуру... может это можно вообще как-то по другому сделать... ПыСы: пробовал функцию для onload описать на уровень выше, за пределами метода add_img - те же яйца. ПыПыСы: заранее благодарю за помощь. |
function myImages(){
var self = this;
this.images = new Array();
this.add_img = function(){
/*
тут идет кусок кода, где я добавляю в документ картинку,
получаю ее node, и дальнейшие действия выполняю только
по окончанию ее загрузки
*/
node.onload = function(){
/*
тут кусок кода, где я из уже загруженной картинки считываю высоту,
ширину и пр. необходимые мне параметры...
И вот тут мне надо в this.images запушить объект с собранными свойствами.
*/
self.images.push(obj)
}
}
}
|
спасибо, но этот вариант я уже рассматривал. Проблема в том, что в таком случае после применения к объекту метода add_img его свойство images останется неизменным, т.к. значение мы записал в переменную, а не в свойство. Получается, что self подходит для считывания this внутри анонимных функций, но не для изменения.
|
kasper_tpk,
Вариант ... кнопку тест нажать после загрузки картинки ... покажет ширину
<!DOCTYPE html>
<html >
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
function myImages(){
this.images = new Array();
this.add_img = function(){
/*
тут идет кусок кода, где я добавляю в документ картинку,
получаю ее node, и дальнейшие действия выполняю только
по окончанию ее загрузки
*/
var node = new Image
document.body.appendChild(node)
node.onload = function(arr){
/*
тут кусок кода, где я из уже загруженной картинки считываю высоту,
ширину и пр. необходимые мне параметры...
И вот тут мне надо в this.images запушить объект с собранными свойствами.
*/
return function () {
obj = this.width
arr.push(obj)
}
}(this.images)
node.src = arguments[0];
}
}
var a = new myImages();
a.add_img('http://javascript.ru/forum/images/ca_serenity/misc/logo.gif')
</script>
<input type="button" name="n" value="test" onclick="alert(a.images[0]);"/>
</body>
</html>
|
Цитата:
|
Нашел решение. Вроде как работает
http://habrahabr.ru/blogs/javascript/103760/ |
Так вы всё таки покажите в каком случае не подходит self?
|
Цитата:
var a = new myImages(); alert(a.images); //Первая проверка a.add_img(); alert(a.images); //Вторая проверка В обеих случая получим одно и то же значение. |
Цитата:
(function(){
alert('Checking a: ' + this.a);
var self = this;
(function(){
alert('Checking a inside function with another this: ' + this.a);
alert('Checking a of original object: ' + self.a);
self.a = 42;
}).call({a : 'some string'});
alert('Checking a: ' + this.a);
}).call({a : 5})
Цитата:
|
Вы уверены?
function myImages(){
var self = this;
this.images = new Array();
this.add_img = function(count){
self.images.push(count);
}
}
var o = new myImages();
o.add_img(1);
alert(o.images);
o.add_img(2);
alert(o.images);
|
| Часовой пояс GMT +3, время: 18:49. |