关于this的判断

对于this,我们在使用的时候常常会遇到this.xxx is undefined的情况

这是因为我们对this的使用没有一个准确的判断,并不知道当前的this指的是什么

如何判断this:

1. 判断是否在new 中使用?如果是的话,this绑定的是新创建的对象

2. 函数是否是通过call(),apply()或者硬绑定调用?如果是的话,this绑定的是指定的对象

3. 函数是否在某个上下文对象中调用?如果是的话,this绑定的是那个上下文对象

4. 如果都不是则默认绑定全局对象 严格模式下绑定到undefined


例外情况:
如果把null,undefined作为this的绑定对象传入call(),apply()或者bind(),
这些值在调用的时候会被忽略,实际绑定的是默认全局对象

 

JavaScript中,我们可以通过`this`关键字来获取当前事件所绑定的HTML元素,然后使用DOM API来获取该元素在表格中的行索引和列索引。下面是一个示例代码,演示如何通过`this`关键字判断点击的单元格位置,并获取其在表格中的行和列索引: ```html <table> <tr> <td onclick="handleClick(this)">A1</td> <td onclick="handleClick(this)">B1</td> <td onclick="handleClick(this)">C1</td> </tr> <tr> <td onclick="handleClick(this)">A2</td> <td onclick="handleClick(this)">B2</td> <td onclick="handleClick(this)">C2</td> </tr> <tr> <td onclick="handleClick(this)">A3</td> <td onclick="handleClick(this)">B3</td> <td onclick="handleClick(this)">C3</td> </tr> </table> <script> function handleClick(cell) { // 获取单元格的行索引和列索引 const row = cell.parentNode.rowIndex; const col = cell.cellIndex; // 判断点击的是哪一行,执行相应的操作 if (row === 0) { // 点击了第一行,执行相应的操作 console.log(`点击了第一行第${col+1}列的单元格`); } else if (row === 1) { // 点击了第二行,执行相应的操作 console.log(`点击了第二行第${col+1}列的单元格`); } else if (row === 2) { // 点击了第三行,执行相应的操作 console.log(`点击了第三行第${col+1}列的单元格`); } else { // 其他情况,不做任何操作 } } </script> ``` 在上面的示例中,我们在每个单元格上绑定了一个`onclick`事件,并使用`this`关键字作为参数传递给`handleClick`函数。在`handleClick`函数中,我们使用`parentNode`和`cellIndex`属性获取到单元格所在的行和列索引,然后根据行索引判断点击的是哪一行,并执行相应的操作。 需要注意的是,DOM API中的行和列索引都是从0开始的,因此在输出单元格位置时,需要将列索引加1。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值