JS 中 if(arr[i]) 和 if(Object.prototype.hasOwnProperty.call(arr, i)) 的区别

在JavaScript中，相同场景下，if(arr[i])  和 if(Object.prototype.hasOwnProperty.call(arr, i)) 这两个表达式的结果可能会截然不同。

1.使用hasOwnProperty

if(Object.prototype.hasOwnProperty.call(arr, i)){
    //判断后的逻辑
}

这个表达式用于检查数组（或任何对象）arr是否自身具有一个名为i的属性（在这个上下文中，i通常是索引）。hasOwnProperty是Object.prototype上的一个方法，它用于判断一个对象是否含有特定的自身属性（不是从原型链上继承的属性）。

• 如果arr数组确实有一个索引为i的元素（即，arr[i]存在），那么Object.prototype.hasOwnProperty.call(arr, i)将返回true。
• 如果i不是一个有效的数组索引（比如，它超出了数组的当前长度），但arr的原型链上没有名为i的属性，那么这个方法也会返回false。

这个表达式主要用于确保你正在访问的是数组自身的属性，而不是从原型链上继承的属性，尽管在标准数组的情况下，这种情况很少见。

2.直接使用arr[i]的值来判断

if(arr[i]){
    //判断后的逻辑
}

这个表达式用于检查数组arr在索引i处的值是否为“真值”（truthy）。在JavaScript中，假值（falsy values）包括false、0、""（空字符串）、null、undefined和NaN。任何其他的值都被认为是真值。

• 如果arr[i]存在且其值是真值（比如，一个非零数字、非空字符串、对象等），那么if(arr[i])将执行其内的代码块。
• 如果arr[i]是假值（比如，0、""或undefined），那么if语句内的代码块将不会执行。
• 如果i超出了数组的当前长度，那么arr[i]将返回undefined，这在布尔上下文中被视为假值，因此if语句内的代码块也不会执行。但是，这与hasOwnProperty检查的目的不同，因为它不是检查属性是否存在，而是检查属性的值是否为真值。

总结

• if(Object.prototype.hasOwnProperty.call(arr, i))用于检查数组arr是否自身具有索引i的属性（不管该属性的值是什么）。
• if(arr[i])用于检查数组arr在索引i处的值是否为真值。

通常，在遍历数组时，你会使用if(arr[i])来检查元素的值是否满足某些条件，而不是使用hasOwnProperty，因为数组索引本身就是数组的属性，且hasOwnProperty在处理数组时不如直接访问arr[i]那样直观和高效。然而，在处理对象时，hasOwnProperty是一个有用的工具，用于确保你正在访问对象自身的属性，而不是从原型链上继承的属性。