通过函数实例访问JS函数变量

Accessing JS function variables through function instance

本文关键字:函数 JS 变量 访问 实例      更新时间:2023-09-26

我只是试图以不同的方式理解函数中定义的变量的行为。所以我只是尝试了一些代码,并在下面的评论中得出结论。如果我理解有什么不对的地方,请告诉我。或者,如果我错过了什么,就加一句。

我想知道如何通过函数实例(objTempFun1objTempFun2)访问函数(如functionName.variableName)上声明的变量,就像我可以在函数内部定义方法以通过函数实例公开闭包变量一样。

function tempFun() {
    this.val1 = "this.var1";
    var val2 = "var var2"; //locally scoped var, not added to function instance nor to the prototype
    this.getLocalVar = function () {
        return val2;
    };
    this.setLocalVar = function (arg) {
        val2 = arg;
    };
}
tempFun.prototype.val3 = "fun.proto.var3";
tempFun.val4 = "fun.var4";
var objTempFun1 = new tempFun();
var objTempFun2 = new tempFun();
/*-----------------------------------------------------------------------
        Variables defined as `this.variableName`
        1. Are declared on prototype
        2. Have separate values across instances
        3. Cannot be accessed on function itself
        -----------------------------------------------------------------------*/
document.write("<br />obj1-this.var1:   " + objTempFun1.val1 + "<br />");
document.write("obj2-this.var1:   " + objTempFun2.val1 + "<br />");
document.write("fun-this.var1:   " + tempFun.val1 + "<br />");
objTempFun1.val1 = "this.var1x";
objTempFun2.val1 = "this.var1y";
document.write("obj1-this.var1:   " + objTempFun1.val1 + "<br />");
document.write("obj2-this.var1:   " + objTempFun2.val1 + "<br />");
/*-----------------------------------------------------------------------
        Variables defined inside function as `var variableName`
        1. Are closure-scoped; defined neither on function nor on prototype
        2. Have separate values across function instances
        3. Can only be accessed through function instance by adding methods on 
           a prototype (as above getLocalVar and setLocalVar methods)
        -----------------------------------------------------------------------*/
document.write("obj1-var var2:   " + objTempFun1.val2 + "<br />");
document.write("obj2-var var2:   " + objTempFun2.val2 + "<br />");
document.write("fun-var var2:   " + tempFun.val2 + "<br />");
document.write("obj1-printLocalVar:   " + objTempFun1.getLocalVar() + "<br />");
document.write("obj2-printLocalVar:   " + objTempFun2.getLocalVar() + "<br />");
objTempFun1.setLocalVar("var var2x");
objTempFun2.setLocalVar("var var2y");
document.write("obj1-printLocalVar:   " + objTempFun1.getLocalVar() + "<br />");
document.write("obj2-printLocalVar:   " + objTempFun2.getLocalVar() + "<br />");
/*-----------------------------------------------------------------------
        Variables defined as `functionName.prototype.variablename`
        1. Are declared on prototype
        2. Have separate values across function instances
        3. Cannot be accessed on function itself
        -----------------------------------------------------------------------*/
document.write("obj1-this.proto.var3:   " + objTempFun1.val3 + "<br />");
document.write("obj2-this.proto.var3:   " + objTempFun2.val3 + "<br />");
document.write("fun-this.proto.var3:   " + tempFun.val3 + "<br />");
objTempFun1.val3 = "fun.proto.var3x";
objTempFun2.val3 = "fun.proto.var3y";
document.write("obj1-this.proto.var3:   " + objTempFun1.val3 + "<br />");
document.write("obj2-this.proto.var3:   " + objTempFun2.val3 + "<br />");
/*------------------------------------------------------------------------
        Variables defined as `functionName.variablename`
        1. Become member of function (or say 'F'unction instance, which is tempFun) 
           not the function instances (which are objTempFun1 & objTempFun2 above)
        2. Cannot be accessed on function instances
        ------------------------------------------------------------------------*/
document.write("obj1-fun.var4:   " + objTempFun1.val4 + "<br />");
document.write("obj2-fun.var4:   " + objTempFun2.val4 + "<br />");
document.write("fun-fun.var4:   " + tempFun.val4 + "<br />");

在此处查找JSFiddle。

constructor属性提供对构造对象的函数的访问。