如何在 JavaScript 中为私有变量使用与函数参数相同的名称？ （使代码看起来更好）

Posted 2023-02-25

【中文标题】如何在 JavaScript 中为私有变量使用与函数参数相同的名称？ （使代码看起来更好）

【英文标题】：How to use the same name for private variables in JavaScript as for function arguments? (to make code look nicer)

【发布时间】：2015-09-30 14:07:37

【问题描述】：

我今天写了 aproximatley 这段代码：

function  Point  ()                     //  1
   var x,  y;                            //  2
                                         //  3
   this.setXY  =  function  (x,  y)     //  4
      x  =  x;                           //  5  doesn't  work
      y  =  y;                           //  6  doesn't  work
                                        //  7
                                        //  8

我想让setXY API 看起来不错，所以我想在第 4 行使用 x 和 y。但是我也想让我的代码在内部很好，所以我使用 x 和 y私有变量在第 2 行。

我的问题是：是否可以在我的代码中到处都有x 和y，用于私有变量和函数参数？如何在第 5 行和第 6 行将 x 分配给 x 和 y 分配给 y 以使其正常工作？

【问题讨论】：

有什么原因不能调用 x,y 参数吗？比如x2 和y2?

是的！像这样 - this.setXY = function (X, Y)

@kevin628 这会使 API 变得丑陋。我想在任何地方使用x 和y 来获得漂亮的内部（私有部分）代码和API（外部API）。

@Maverick 有趣，大写 X 和 Y 用于函数参数

setXY 本身应该很清楚。如果另一位开发人员对参数名称感到心烦意乱，那么他或她是在错误的职业中。不要编写代码让 API 和文档看起来很吸引人；为相当聪明的开发人员编写自我记录的代码。

【参考方案1】：

简短回答：不，这是不可能的。通过在 this.setXY 方法中保持相同的名称，您实际上是在覆盖父作用域的变量。

您似乎允许修改原始 x 和 y 值 - 为什么不简单地公开它们并将您的方法用作实用程序？

function Point (x, y) 
  this.x = x;
  this.y = y;

  // set X,Y in a single statement
  this.setXY = function (x, y) 
    this.x = x;
    this.y = y;
  

  // utility example
  this.distance = function (x, y) 
    x = this.x - x;
    y = this.y - y;
    return Math.sqrt(x * x + y * y);
  

或者定义一个对象来存储具有相同名称/键的变量：

function Point (x, y) 

  // a private key store
  var point = 
    x: x || 0,
    y: y || 0
  ;

  this.setXY = function (x, y) 
    point.x = x;
    point.y = y;
  

【讨论】：

我喜欢替代解决方案。除了通过point 对象外，我仍在代码中使用x 和y。

我也喜欢第二种方法，虽然我不会经常使用它。您也可以在函数之外使用类似的约定，例如。 var point = new Point();

没错，但是如果您允许直接使用 setXY 方法设置值，那应该不是问题

【参考方案2】：

在setXY 内，函数参数x 和y 是隐藏在Point 函数体中定义的局部变量x 和y。 p>

在 javascript 中，没有直接的方法可以访问阴影变量。通过声明参数名称来隐藏局部变量，您使局部变量无法访问。

通常，在这种情况下，javascript 开发人员不会尝试访问阴影变量，而是执行以下两种操作之一：

使用不同的变量名：

function Point() 
  var _x, _y;
  this.setXY = function(newX, newY) 
    _x = newX;
    _y = newY;
  ;

p = new Point();
p.setXY( 5, 7 );

将特定于对象的值存储在this 中，而不是作为局部变量：

function Point() 
  this.setXY = function(x, y) 
    this.x = x;
    this.y = y;
  ;

p = new Point();
p.setXY( 5, 7 );

这两种方法的主要区别在于

由于它们是局部变量，_x 和 _y 无法从 Point 的定义之外访问，因此无法通过 setXY 更新它们除了 .

由于this.x 和this.y 是对象成员，因此任何引用this 的人都可以访问它们，并且可以在Point 的定义之外进行修改，而无需使用setXY。继续之前的代码：

console.log( p.x, p.y ); // prints 5, 7
p.x = 11;
console.log( p.x, p.y ); // prints 11, 7

【讨论】：

感谢您的详细解答。如果没有更好的答案，我投了赞成票，并将在接下来的几天内接受答案。你的回答完美地解释了一切。方法 2 对安全编程很危险。方法 1 看起来不错，我将继续使用它，但我仍将在内部使用 x 而不是 x 并使用 newX 作为函数参数。后续问题：您如何看待使用setXY(xx, yy) - 变量名加倍？我刚想出了这个方案。或setName(namename)。或split(sizesize)。我想我比newX 更喜欢加倍变量名方案。

bodacydo：老实说，我认为你问错了问题。看起来您想为参数使用相同的名称以避免使“API 变得丑陋”。用户不应该通过阅读您的函数定义来学习您的 API，他们应该阅读文档。如果你有一个工具可以从你的函数定义生成文档，为什么不问如何让这个工具使用不同的参数名称呢？

第一种方法，为什么不用x和y代替newX和newY作为参数呢？

冷蓝色：记录意图

你是如何记录的？是否有任何用于 javascript 的特殊文档工具？我以为大家都是看代码找api函数的？