什么时候用引号括起 JS 变量

Question

我有以下正在运行的 JS，但我对为什么需要将变量 func 括在引号中感到困惑。有人可以解释一下吗？

function CustomPrompt(){
 this.render = function(dialog,func){
   var winW = window.innerWidth;
   var winH = window.innerHeight;
   var dialogoverlay = document.getElementById('dialogoverlay');
   var dialogbox = document.getElementById('dialogbox');

   dialogoverlay.style.display = "block";
   dialogoverlay.style.height = winH+"px";
   dialogbox.style.left = (winW/2) - (550 * .5)+"px";
   dialogbox.style.top = "100px";
   dialogbox.style.display = "block";

   document.getElementById('dialogboxhead').innerHTML = '&nbsp';
   document.getElementById('dialogboxbody').innerHTML = dialog;
   document.getElementById('dialogboxbody').innerHTML += '<br><input id="prompt_value1"  >';
  
   document.getElementById('prompt_value1').focus();

//HERE'S THE LINE I'M CONFUSED BY
//*******************************
   document.getElementById('dialogboxfoot').innerHTML = '<button onclick="Prompt.ok(\''+func+'\')">OK</button> <button onclick="Prompt.cancel()">Cancel</button>';
    
 }

 this.cancel = function(){
   document.getElementById('dialogbox').style.display = "none";
   document.getElementById('dialogoverlay').style.display = "none";
 }
 this.ok = function(func){
   var prompt_value1 = document.getElementById('prompt_value1').value;
   window[func](prompt_value1);
   document.getElementById('dialogbox').style.display = "none";
   document.getElementById('dialogoverlay').style.display = "none";
 }
}

Answer 1

func 变量似乎是一个字符串，它标识附加到全局 window 对象的函数，您在 ok 函数中使用 window[func](prompt_value1); 调用该对象。

func 需要作为字符串发送，因为 它是 window 对象上的键。

如果您要删除示例中的 qoutes，按钮的 onclick 方法将尝试在当前范围内发送 func 变量的值。由于 func 是在您的函数范围内声明的，因此您将无法访问它。相反，变量值是内联的。

本例内联变量place

function hello(place) {
  console.log(place);
}
function iHaveMyOwnScope() {
  var place = "world"; // this is in my scope
  var container = document.getElementById('container1');
  container.innerHTML = '<button onclick="hello(\''+place+'\')">Hello1</button>';
}
iHaveMyOwnScope();

<div id="container1"></div>

这个例子试图通过全局范围

访问变量place

由于 place 未在全局范围内定义，因此无法访问。

function hello(place) {
  console.log(place);
}
function iHaveMyOwnScope() {
  var place = "world"; // this is in my scope
  var container = document.getElementById('container1');
  container.innerHTML = '<button onclick="hello(place)">Hello2</button>';
}
iHaveMyOwnScope();

<div id="container1"></div>

此示例以编程方式创建按钮并在函数范围内附加事件处理程序

function hello(place) {
  console.log(place);
}
function iHaveMyOwnScope() {
  var place = "world"; // this is in my scope
  var container = document.getElementById('container1');
  
  var button = document.createElement('button')
  button.innerHTML = 'Hello3'
  button.addEventListener('click', function() {
    // Here we can access the place variable
    // since this handler is defined in the functions scope
    hello(place)
  }, false)
  
  // Add button to container
  container.appendChild(button);
}
iHaveMyOwnScope();

<div id="container1"></div>

什么时候用引号括起 JS 变量

When to wrap JS variable in quotes

javascript

function

quotes