在 Javascript 中跨不同范围访问变量 [英] Accessing a variable across different scopes in Javascript

问题描述

var todoList = {待办事项:[]displayTodos: 函数 () {console.log(this.todos[i].todoText);}addTodo: 函数 (todoText) {this.todos.push({todoText: todoText});}}

这不是完整的程序，但我的问题是:

在 displayTodos 函数中，我如何访问 todoText(在控制台日志行中)?

在 addToDo 函数中声明的 todoText 变量的范围不应该被限制在声明它的函数 addToDo 中吗?

谢谢

解决方案

这与函数的 *context * 有关.不是范围，而是上下文.

范围:

这与函数可见的变量有关.

函数可以访问它们的局部变量(在它们的定义体内声明包括任何作为局部变量添加的参数)和 在它们被调用的封闭范围内的任何变量.

上下文(适用于 OP 问题):

与如何调用函数或什么分配给的对象有关在它被调用/调用时.更具体地说，它定义了 this 的值在函数定义中解析为什么.

<小时>

示例

假设您按如下方式调用这些方法:

todoList.addTodo("some text");todoList.addTodo("其他文本");todoList.dispayTodo(1);//使这个单数，见下面的解释//注销 >其他文字"

在上面的例子中，所有三个函数都作为对象todoList的方法被调用，反过来，两者中的this值将引用todoList 对象.

将包含属性 todoText 的对象推送到 this.todos 数组后，您将拥有以下数组:

<预><代码>[{todosText:"一些文本"},{todosText:"其他文本"}]

并且您可以通过将正确的索引推送到 displayTodo 来访问每个停留元素(尽管对您的代码稍作修改以接受索引作为参数)

var todoList = {...displayTodo: 函数(i) {console.log(this.todos[i].todoText);}}

var todoList = {
  todos: []


  displayTodos: function () {
     console.log(this.todos[i].todoText);
}

  addTodo: function (todoText) {
    this.todos.push({todoText: todoText});
}
}

This isn't the complete program, but my question is this:

In the displayTodos function, how am I able to access todoText (in the console log line)?

Shouldn't the todoText variable that's declared in the addToDo function be limited in scope to the function in which it's declared, addToDo?

Thanks

解决方案

This has to do with the *context * of a function. Not scope, but context.

Scope:

This relates to what variables are visible to a function.

Functions have access to their local variables (declared inside the body of their definitions including any argument parameters which get added as local variables) and any variables in the enclosing scope that they are called.

Context (applies to OP question):

Has to do with how the function was called or what object it gets assigned to at the time it is called/invoked. More specifically, it defines what the value of this resolves to in a function definition.

---

An example

Let's make the assumption that you are calling these methods as follows:

todoList.addTodo("some text");
todoList.addTodo("other text");
todoList.dispayTodo(1); // made this singular, see below for explanation
// logs out > "other text"

In the case above all three functions are called as methods of the object todoList and in turn, the this value inside of both will refer to the todoList object.

After pushing an object that contains a property todoText into this.todos array you'll have the following array:

[
  {todosText:"some text"},
  {todosText:"other text"}
]

And you can access each stay element by pushing in the correct index to displayTodo (albeit with a slight modification to your code to accept the index as an argument)

var todoList = {
  ...
  displayTodo: function(i) {
    console.log(this.todos[i].todoText);
  }
}

这篇关于在 Javascript 中跨不同范围访问变量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！