JavaScipt — как получить доступ к внешнему this?

Question

[Даниил Мирошниченко]

Есть такой вот код:

var TreeCreator = function(width, height, treeData) {
    this.state = {
            selectedNode: false,
           nodeId: 0
         };

TreeCreator.prototype.renderTree = function() {
    var node = this.svg.selectAll(".node")
            .data(nodes, function (d) {
                d.px = d.x;
                d.py = d.y;
                return d.id || ++this.state.nodeId;
            });
    };

Понятное дело, что кода намного больше. Я просто взял один из проблемных кусков, чтобы было понятно.
Так вот, в строчке return d.id || ++this.state.nodeId, this это не TreeCreator, а внутренний объект.
Как мне получить доступ к this, который как бы на уровень выше?

Таких вот, случаев достаточно много и делать каждый раз что-то типа thisTree = this перед вызовом внутренних функций неудобно...

Answer 1

[Денис Пушкарев]

.data(nodes, (function (d) {...}).bind(this))
хотя те же яйца, только в профиль. В ES6 будут стрелочные функции с сохранением контекста, аналогично кофе, но вот только не скоро это будет.

Comments

[Вячеслав Слинько]

Уже сейчас можно пользоваться компилаторами es6->es5(3).
Я сейчас плотно работаю с этой темой, и уже для большинства новых фич есть компиляторы или полифиллы.
https://www.npmjs.org/package/es6-arrow-function
https://www.npmjs.org/package/es6-class-classic
https://www.npmjs.org/package/es6-comprehensions
https://www.npmjs.org/package/es6-computed-propert...
https://www.npmjs.org/package/es6-default-params
https://www.npmjs.org/package/es6-for-of
https://www.npmjs.org/package/es6-modules-commonjs
https://www.npmjs.org/package/es6-object-concise
https://www.npmjs.org/package/es6-object-short
https://www.npmjs.org/package/es6-rest-params
https://www.npmjs.org/package/es6-spread
https://www.npmjs.org/package/es6-templates
https://www.npmjs.org/package/jsx-recast
facebook.github.io/regenerator
https://www.npmjs.org/package/defs

[Денис Пушкарев]

@KeepYourMind главное забыл - traceur - https://github.com/google/traceur-compiler :)
Я вот со стандартной библиотекой (в первую очередь - по ES6, хотя и не только) играюсь - https://github.com/zloirock/core-js

[Вячеслав Слинько]

Не нравится мне traceur тем, что использует свой runtime.
Плюс он совместим с ES5, но не ES3, что значит IE8 в ауте, а с этим я пока смириться не могу.

Answer 2

[Pavel Shvedov]

По другому получить нужный this, увы, не получится. Сохраняйте заранее. Ну или если хочется забыть про такие костыли, я например, пишу на CoffeeScript. В нем есть синтаксический сахар, специально для этого случая, и не надо писать кучу лишнего

Comments

[Даниил Мирошниченко]

Печально(
Спасибо за ответ

Answer 3

[Кирилл]

Может стоит посмотреть в сторону function.apply({объект который будет this}, [массив аргументов])?
javascript.ru/Function/apply
выделить

function (d) {
                d.px = d.x;
                d.py = d.y;
                return d.id || ++this.state.nodeId;
            }

в отельную функцию и вызывать через apply

Answer 4

[Константин Величко]

Так

var that = this;
…
return d.id || ++that.state.nodeId;