arrayfilter.call

`Array.prototype.filter.call` 是 JavaScript 中的一个方法，它用于遍历数组并创建一个新的数组，新数组包含通过提供的函数测试的所有元素。这里的 `call` 是 Function 对象上的方法，用于调用函数，并允许将函数上下文（this值）设置为指定的对象。

当你需要在非数组对象上调用 `filter` 方法，或者你想改变 `filter` 内部 `this` 的指向时，可以使用 `call` 函数。例如：

let obj = {
  name: 'John',
  age: 30,
  condition: function() { return this.age > 25; }
};

let filtered = Array.prototype.filter.call(obj, function(item) {
  // 这里的 this 指向 obj
  return item.condition();
});

console.log(filtered); // 输出：[ { name: 'John', age: 30 } ]

在这个例子中，`call` 被用来确保 `condition` 方法内部的 `this` 关联到 `obj`，而不是默认的全局 `window` 对象。

相关问题

Array.prototype.slice.call

Array.prototype.slice.call() 是 JavaScript 中的一个实用技巧，它允许你在非数组对象上调用 Array 的 slice 方法。JavaScript 的 Array 类型有一些内置方法，如 map、filter、reduce 等，它们通常只能用于真正的数组对象上。但是，通过使用 call 或 apply 方法，你可以将这些方法应用到其他具有同样方法签名的对象上。

当你想要对像 NodeList、Function 参数列表或其他非数组对象执行数组方法时，可以这样做：

// 假设我们有一个 DOM NodeList 和一个函数
const nodeList = document.querySelectorAll('div');
function processItems(array) {
  // ...
}

// 使用 call 将 slice 方法应用于 nodeList
const slicedNodes = Array.prototype.slice.call(nodeList, start, end);

// 现在 slicedNodes 就是一个正常的数组，可以进行常规的数组操作
processItems(slicedNodes);

var form = document.getElementById("productForm"); var visibleFormElements = Array.prototype.slice.call( form.querySelectorAll( "input:not([type=hidden]), select, textarea, radio, checkbox" ) ).filter(function (element) { return element.offsetParent !== null; }); var names = visibleFormElements.map(function (element) { return element.getAttribute("name"); });获取不到单选框、复选框的那么属性

单选框和复选框的值需要通过 element.checked 属性进行获取，可以将代码修改为以下形式：

var form = document.getElementById("productForm");
var visibleFormElements = Array.prototype.slice.call(
    form.querySelectorAll(
        "input:not([type=hidden]), select, textarea, radio, checkbox"
    )
).filter(function (element) {
    return element.offsetParent !== null;
});

var names = visibleFormElements.map(function (element) {
    if (element.type === "checkbox" || element.type === "radio") {
        return element.checked ? element.getAttribute("name") : null;
    }
    return element.getAttribute("name");
}).filter(function (name) {
    return name !== null;
});

这样可以正确获取单选框和复选框的 name 属性。