为对象创建 jquery 插件

Question

我想为数组拼接创建一个 jquery 插件（与 push() 函数相反）。但我收到错误
Uncaught TypeError: allfiles.pull is not a function
这是我的代码：

$.fn.pull = function (index) {
	this.splice(index-1,1);
}

var allfiles = ['1','2','3','4','5'];
$("div").html(allfiles);
allfiles.pull(1);
$("div").html(allfiles);

.first:before{
content:'Before:';
}
.second:before{
content:'After:';
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="first"></div>
<div class="second"></div>

Answer 1

因为$.fn.pull扩展了jQuery函数列表，所以它没有给对象Array添加方法。为此，请执行Array.prototype.pull。在您的原始代码中Array.pull (allfiles.pull) 是undefined，因为您从未声明过它。

我已更改您的代码并将数组包装成一个 jQuery 函数：$(allfiles)。这应该可以满足您的需求。

$.fn.pull = function (index) {
	this.splice(index-1,1);
  return this.toArray();
}

var allfiles = ['1','2','3','4','5'];
$("div.first").html(allfiles);
allfiles = $(allfiles).pull(1);
$("div.second").html(allfiles);

.first:before{
content:'Before:';
}
.second:before{
content:'After:';
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="first"></div>
<div class="second"></div>

带有 Array.prototype.pull 的堆栈片段（不推荐*）

Array.prototype.pull = function (index) {
	return this.splice(index-1,1);
}

var allfiles = ['1','2','3','4','5'];
$("div.first").html(allfiles);
allfiles.pull(1);
$("div.second").html(allfiles);

.first:before{
content:'Before:';
}
.second:before{
content:'After:';
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="first"></div>
<div class="second"></div>

* 不建议使用自定义函数更改 JavaScript 的原始对象，例如 Array。行为可以改变，或者像 jQuery 这样的外部脚本可以依赖相同的名称。 pull 非常通用。至少使用一个明确的名称myproject_pull。