Передача this в анонимную функцию

[afdw]

В JS есть проблема, связанная с доступом к this в анонимной функции:

this.test = 2 * 2;console.log(this.test); // 4callback(function(){  console.log(this.test); // undefined});

Я знаю два способа её решения:

• Создать ссылку на this:

  this.test = 2 * 2;console.log(this.test); // 4var self = this;callback(function(){  console.log(self.test); // 4});

• Использовать метод "bind" для подмены this:

   

  this.test = 2 * 2;console.log(this.test); // 4callback((function(){  console.log(this.test); // 4}).bind(this));

Первый способ мне не нравится из-за введение дополнительной переменной. Второй - из-за лишних скобок и в следствии этого ухудшения читабельности. Знаете ли вы более элегантные решения этой проблемы? Edited April 23, 2015 by afdw

[Great Rash]

Других способов нет. По крайней мере лучше чем эти.

[ivanko]

var callback = function(fn)/*

fn.applay(this,arguments);

*/

сори не обнаружил скобок на планшете (

так не сойдет ?

[nerv]

Я знаю два способа её решения

третий - es6 arrow function

[afdw]

 

Я знаю два способа её решения

третий - es6 arrow function

 

Хм, я всегда думал, что это - просто сокращение от function. Какая сейчас поддержка ES6 и когда ожидается полная в Chrome и Firefox?

[nerv]

Какая сейчас поддержка ES6 и когда ожидается полная в Chrome и Firefox?

http://css-live.ru/javascript/kak-ispolzovat-ecmascript-6-segodnya.html

[Great Rash]

nerv, а объясни пожалуйста чем этот метод лучше чем методы, описанные топикстартером? Имхо даже метод fn.apply более читабельный чем то, что мутят в ES6. Мне часто приходится разбираться в чужом коде и я никогда не могу понять зачем нужно извращаться вместо того, чтобы писать понятный и простой код.

[afdw]

nerv, а объясни пожалуйста чем этот метод лучше чем методы, описанные топикстартером? Имхо даже метод fn.apply более читабельный чем то, что мутят в ES6. Мне часто приходится разбираться в чужом коде и я никогда не могу понять зачем нужно извращаться вместо того, чтобы писать понятный и простой код.

Тем, что этот метод позволяет вообще не задумываться над передачей. В ES6 мутят альтернативу оператору function. То есть вместо

function(arg){  // ...}

можно будет писать

arg =>{  // ...}

Для callback'ов - самое оно. Такой метод записи уже доступен в TypeScript и в трансляторах ES6.

 

---

 

Имхо даже метод fn.apply более читабельный чем то, что мутят в ES6

Может быть, если бы можно было писать так:

this.test = 2 * 2;console.log(this.test); // 4callback(function(){  console.log(this.test); // 4}.bind(this));

Edited May 5, 2015 by afdw

[Great Rash]

arg =>{  // ...}

Как же будет выглядеть если аргуметов больше одного? Скобки чтоль?

 

Всё равно не понимаю чем это лучше. Представляю какую-то мега-функцию где в этих this запутаешься пока поймёшь к какой области видимости относится то или иное свойство.

[afdw]

Скобки чтоль

Да

Всё равно не понимаю чем это лучше. Представляю какую-то мега-функцию где в этих this запутаешься пока поймёшь к какой области видимости относится то или иное свойство.

Можете предложить реальный пример того, где больше 1 области видимости? Вот оборачивать каждую функцию в горе колбеков в скобочки и дописывать ".bind(this)" - действительно муторно.

[nerv]

Может быть, если бы можно было писать так

так можно =)

 

объясни пожалуйста чем этот метод лучше чем методы, описанные топикстартером? Имхо даже метод fn.apply более читабельный чем то, что мутят в ES6. Мне часто приходится разбираться в чужом коде и я никогда не могу понять зачем нужно извращаться вместо того, чтобы писать понятный и простой код

я когда первый раз увидел эти arrow function сам плевался))) и приводил примеры вида:

var foo = x <= 1;var bar = y => 2;console.log(foo); // falseconsole.log(bar); // function bar(NaN) {return 2;}

var foo = bar => baz => true;console.log(foo); // function foo(bar) {//    return function (baz) {//        return true;//    };//}

будет раздолье для говно-кодеров)

В целом, вещь полезная, но в качестве заглушки для динамического this - как из пушки по воробьям. Лучше бы еще один режим ввели а-ля

'use strict';

в котором this был бы лексическим.

Использовал это нововведение в рекурсивном итераторе.

Те, кто не интересовался es6, поясню, что в новом стандарте вводится такое понятие как "итератор".

Тема про мой итератор здесь. Была статья на хабр, но ее зарезали. Она показывала, как просто и элегантно реализовывается операция глубокого копирования и другие.

В двух словах, эта штука позволяет рекурсивный обход свести к обходу циклом + доп. плюшки (см. апи на гитхабе).

---

Сам пишу на es6 уже пятый месяц, arrows function использую редко.

Как ты знаешь, в js есть функции определения и функции выражения. Отчасти смотрю на стрелочные функции, как на разграничивающие эти понятия.

На мой взгляд arrows function - одно из спорных нововведений.

Самое значимое - модули.

[afdw]

 

Может быть, если бы можно было писать так

так можно =)

 

Нет. Для сравнения.

[nerv]

Нет

ты путаешь передачу функции с вызовом функции. Сам сделаешь примеры?

[afdw]

 

Нет

ты путаешь передачу функции с вызовом функции. Сам сделаешь примеры?

 

Да, точно. Вот в чём было дело. Спасибо!

[afdw]

JS:

(x) => x * x

Python:

(x) -> x * x

Ruby:

->(x){ x * x }

Так что это уже считается нормально

Edited May 5, 2015 by afdw