Question

我有一个构造函数：

function Point(point, left, right) {
    this.p = point;
    this.l = left;
    this.r = right
}
var bezierPoint = new Point([0.0,0.0],[-50.43794, 0.0],[25.54714,4.78643])

有没有一种方法可以制作一个我可以在所有属性中使用的方法而不是对象本身？例如，如果我想输出

console.log(bezierPoint.l) // -50.43794, 0.0
console.log(bezierPoint.l.round()) // -50, 0
console.log(bezierPoint.r.round()) // 26, 5

或者这是错误的方法，我应该为我将要使用的数据类型制定新的方法？像

这样的东西

Array.prototype.round = function() {
    return [Math.round(this[0]), Math.round(this[1])] //this code doesn't matter now
}
console.log(bezierPoint.l.round()) // -50, 0

Answer 1

您可以将参数用作内部变量，并按如下方式公开方法：

function Point(point, left, right) {

    function exposed(points) {
        return {
            value: function () {
                return points;
            },
            round: function () {
                return [Math.round(points[0]), Math.round(points[1])];
            }
        };
    }

    this.p = exposed(point);

    this.l = exposed(left);

    this.r = exposed(right);

}

然后你就可以使用它：

var bezierPoint = new Point([0.0, 0.0], [-50.43794, 0.0], [25.54714, 4.78643]);

document.write('value:' + bezierPoint.l.value() + '<br />'); // value:-50.43794,0

document.write('round:' + bezierPoint.l.round() + '<br />'); // round:-50,0

Answer 2

又一种方法。多一点代码，但更多原型和实体。

// Common point class

/**
 * Creates simple point class
 * Point can be passed as two separate coordinates or as an array (coordinates pair). In case of array, second argument is omitted.
 * @param {String|Number|Array} a
 * @param {String|Number|undefined} b
 * @returns {Point}
 */
var Point = function (a, b) {
    if (!!a && !!b) {
        this.a = parseFloat(a);
        this.b = parseFloat(b);
    } else if (a.constructor === Array ? a.length === 2 : false) {
        this.a = parseFloat(a[0]);
        this.b = parseFloat(a[1]);
    } else {
        throw 'Wrong data provided for `Point`';
    }
}

/**
 * @returns {Array} Rounded coordinates pair
 */
Point.prototype.round = function () {
    return [Math.round(this.a), Math.round(this.b)];
}

/**
 * @returns {Array} Raw coordinates pair (as they were passed to constructor)
 */
Point.prototype.value = function () {
    return [this.a, this.b];
}

// Bezier point class

/**
 * Creates a Bezier point instance
 * @param {Array|Point} point
 * @param {Array|Point} left
 * @param {Array|Point} right
 * @returns {BezierPoint}
 */
var BezierPoint = function (point, left, right) {
    this.p = point instanceof Point ? point : new Point(point);
    this.l = left instanceof Point ? left : new Point(left);
    this.r = right instanceof Point ? right : new Point(right);
}

// Operation

var bezierPoint = new BezierPoint([0.0,0.0], [-50.43794, 0.0], [25.54714,4.78643]);

每个点都可以作为数组或格式良好的BezierPoint类传递给Point。

UPD：作为现有答案能力的延伸，可以提供定义任意数量的点数。

var ArbitraryNumberOfPoints = function (args) {
    this.points = args.length === 0 ? [] :
        args.map(function (arg) {
            return arg instanceof Point ? arg : new Point(arg);
        });
}

ArbitraryNumberOfPoints.prototype.round = function () {
    return this.points.map(function (pointInstance) {
        return pointInstance.round();
    });
}

Javascript

2 个答案: