Объект/функция объекта Javascript внутри другого

Question

Я искал наилучшее решение, но я не знаю, какое ключевое слово я должен искать. Мне нужно немного объяснения моей проблемы :) То мой код:

function fluidEdge(params) { 
    var fluid = {}; 
    fluid.point = function(config){ 
    fluid.x = config.x; 
    fluid.y = config.y; 
    }; 
    fluid.renderShape = function(params){ 
    params = params || {}; 
     var x = params.x || 0; 
     var y = params.y || 0; 
    point = new fluid.point({ 
     x: x, 
     y: y 
    }); 
    console.log(point.x); 
    }; 

    return fluid; 
} 

var test = new fluidEdge({}); 

test.renderShape({x: 50, y: 100}); 

Fiddle

Мой пример является гораздо более сложным, так что я не могу восстановить код, я упростил его столько, сколько как я мог. Я хочу получить доступ к функции fluid.point внутри fluid.renderShape. Я понятия не имею, как это сделать, я пробовал несколько способов.

Прежде чем я не использовал var fluid = {}; и fluid. всюду, но this. и все было хорошо.

Если я ошибаюсь, вы можете указать это тоже. Заранее спасибо.

Answer 1

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

function FluidEdge(params) {} 

FluidEdge.Point = function(config) { 
    this.x = config.x; 
    this.y = config.y; 
} 

FluidEdge.prototype.renderShape = function(params) { 
    params = params || {}; 
    var x = params.x || 0; 
    var y = params.y || 0; 

    var point = new FluidEdge.Point({x: x, y: y}); 

    console.log(point.x); 
} 

var test = new FluidEdge({}); 
test.renderShape({x: 50, y: 100}); 

Обратите внимание на использование prototype для обозначения методов в конструкторе, а также использование this для обозначения построенного объекта.

Также обратите внимание, что размещение конструкторов в переменных экземпляра - это, как правило, плохая идея, если вы не знаете, что делаете, и у вас есть все основания.

Стоит отметить, что этот код становится гораздо лучше выглядит, если вы воспользоваться ES2015 особенности

class FluideEdge { 
    renderShape({x = 0, y = 0}) { 
    var point = new FluidEdge.Point({x, y}); 
    console.log(point.x); 
    } 
} 
FluidEdge.Point = class { 
    constructor({x, y}) { 
    this.x = x; 
    this.y = y; 
    } 
} 

Answer 2

Я просто понял, что я просто изменил слишком много this в fluid в моем коде. Проблема была там:

fluid.point = function(config){ 
    this.x = config.x; 
    this.y = config.y; 
}; 

Это хорошо работает после этого небольшого изменения.