node----let与var--记录

  • 作用域
    通过let定义的变量,作用域是在定义它的块级代码以及其中包括的子块中,并且无法在全局作用域添加变量。
    通过var定义的变量,作用域为包括它的函数作用域或者全局作用域
function varTest() {
  var x = 1;
  if (true) {
    var x = 2;  // same variable!
    console.log(x);  // 2
  }
  console.log(x);  // 2
}


function letTest() {
  let x = 1;
  if (true) {
    let x = 2;  // different variable
    console.log(x);  // 2
  }
  console.log(x);  // 1
}
// let 无法在全局作用域中定义变量
var x = 'global';
let y = 'global';
console.log(this.x); // "global"
console.log(this.y); // undefined
  • 重复声明
    通过let定义的变量,在同一个作用域内,不可以重复声明。
    通过var定义的变量,在同一个作用域内,重复声明,在生成执行上下文的时候,会无视后面的声明。
// 报错
(function () {
  let a = 10;
  var a = 1;
  console.log(a)
})()
// 报错
(function () {
  let a = 10;
  let a = 1;
  console.log(a)
})()
// 报错
(function () {
  var a = 10;
  var a = 1;
  console.log(a) // 1
})()
  • 临时死区引起的提升等问题
    我们知道在代码执行之前,会先扫描所有域内的var声明的变量,将其先进行初始化为undefined,然后再执行代码,也就是所谓的“提升”现象。但对于let声明的变量而言,则有所不同。在代码执行之前的扫描,同样也会对let变量进行“提升”,但并没有将其置为undefined。let定义的变量虽然经历了提升,但在没有执行到初始化它的代码前,该变量并没有被初始化,如果此时访问的话,会被置为ReferenceError错误。从代码块开始到执行到let变量初始化完毕这段时间,let变量已经被声明,但不可访问。这段时间被成为临时死区。
// let变量的作用域为function scope
function do_something() {
  console.log(bar); // undefined
  console.log(foo); // ReferenceError
  var bar = 1;
  let foo = 2;
}
// let变量的作用域为整段代码,
// prints out 'undefined'
console.log(typeof undeclaredVariable);  // typeof对于未声明的变量返回undefined
// results in a 'ReferenceError'
console.log(typeof i);
let i = 10;
// let 变量为block scope,在初始化时使用,依然会视为临时死区,只有在初始化执行完后才可以使用
function test(){
   var foo = 33;
   if (true) {
      let foo = (foo + 55); // ReferenceError
   }
}
test();
// let 变量在for的block scope内进行了声明,n.a对应的是在本地作用域中的let变量n。在未初始化前,通过n.a进行了访问了n,因此报错
function go(n) {
  // n here is defined!
  console.log(n); // Object {a: [1,2,3]}


  for (let n of n.a) { // ReferenceError
    console.log(n);
  }
}


go({a: [1, 2, 3]});

Tip:需要注意的是,和let一起引入的const同样拥有“临时死区”的特性,也一样无法重复声明。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 可以在ag-grid-vue组件的template中使用v-bind指令绑定一个自定义函数来调整单元格样式,在该函数中进行判断并修改样式。 例如,在template中添加如下代码: ``` <ag-grid-vue :columnDefs="columnDefs" :rowData="rowData" :onCellEditingStarted="onCellEditingStarted" > </ag-grid-vue> ``` 然后在Vue组件中定义onCellEditingStarted函数,进行样式调整: ``` methods: { onCellEditingStarted(params) { // 获取单元格元素 let element = params.eGridCell.querySelector(".ag-cell-value"); // 调整样式 element.style.backgroundColor = "red"; } } ``` 在这个例子中, onCellEditingStarted 函数中获取到了当前单元格的DOM元素,并将背景颜色设置为红色。 ### 回答2: 在ag-grid-vue中,可以通过监听cellEditingStarted事件来调整单元格的样式。当用户开始编辑单元格时,该事件将被触发。 要调整单元格的样式,可以使用ag-grid-vue提供的API,例如getCellRendererInstance方法来获取单元格渲染器实例,然后使用实例的方法来修改样式。 首先,在gridOptions中定义cellEditingStarted事件的回调函数。在这个回调函数里面,可以获取当前编辑的单元格的渲染器实例,并通过修改其样式来改变单元格的外观。 示例代码如下: ``` gridOptions: { columnDefs: [ // 列定义 ], onCellEditingStarted: function(params) { var cellRendererInstance = params.api.getCellRendererInstance(params.node, params.column); // 根据需要修改单元格的样式 cellRendererInstance.setStyle('background-color', 'yellow'); } } ``` 在这个例子中,当用户开始编辑一个单元格时,onCellEditingStarted函数会被调用。通过调用params.api.getCellRendererInstance方法,可以获取到当前编辑的单元格的渲染器实例。然后,可以使用cellRendererInstance来调用setStyle方法,来修改单元格的样式。这里以改变背景色为例,将单元格的背景色修改为黄色。 通过使用onCellEditingStarted事件和getCellRendererInstance方法,我们可以在ag-grid-vue中根据需要动态调整单元格的样式。 ### 回答3: 当ag-grid-vue触发cellEditingStarted事件时,我们可以通过调整单元格的样式来实现自定义效果。 在Vue中,我们可以通过定义一个方法,在cellEditingStarted事件中调用该方法来实现样式的调整。首先,在组件的方法中定义一个cellEditingStarted方法,该方法接收一个参数event,代表触发事件的对象。 在cellEditingStarted方法中,我们可以通过event对象获取到当前正在编辑的单元格的相关信息,比如其所在的行、列、和编辑的值。然后,我们可以根据这些信息来动态地修改单元格的样式。 例如,我们可以通过event.api.getCellRendererInstances方法获取到所有的单元格渲染器实例,然后通过遍历这些实例的方式找到正在编辑的单元格。通过修改该单元格的样式,我们可以改变单元格的背景色、字体颜色等等。 除了通过修改单元格的样式,我们还可以通过修改单元格渲染器的方式来实现更复杂的效果。例如,我们可以通过自定义一个组件,并将其作为单元格渲染器,在触发cellEditingStarted事件时将该组件渲染到单元格中,从而实现自定义的样式和交互效果。 总之,ag-grid-vue的cellEditingStarted事件提供了许多灵活的方式来调整单元格样式。通过在该事件中处理方法,我们可以根据需要来动态地修改单元格的样式,从而实现更加自定义和丰富的用户体验。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值