JavaScript函数参数 - 初学者问题 [英] JavaScript function parameter - Beginner Question
问题描述
我是JavaScript的新手，来自Python。我很难理解'rect'的来源以及如何通过以下脚本传递（我从tracking.js中获取）：任何帮助都会非常感激，我相信这个问题可能也会有所帮助任何其他来自Python。
I am new to JavaScript and coming from Python. I am having a hard time to understand where the 'rect' is coming from and how it is passed in the following script (that I took from tracking.js): Any help would be really appreciated and I believe this question would probably also help any other coming from Python.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>tracking.js - first tracking</title>
<script src="../build/tracking-min.js"></script>
</head>
<body>
<video id="myVideo" width="400" height="300" preload autoplay loop muted></video>
<script>
var colors = new tracking.ColorTracker(['magenta', 'cyan', 'yellow']);
colors.on('track', function(event) {
if (event.data.length === 0) {
// No colors were detected in this frame.
} else {
event.data.forEach(function(rect) {
console.log(rect.x, rect.y, rect.height, rect.width, rect.color);
});
}
});
tracking.track('#myVideo', colors);
</script>
</body>
</html>
推荐答案
当您致电 forEach 在一个数组上， forEach 中的代码调用你为数组中的每个条目传递的函数，将该条目传递给函数（还有其他一些事情）。所以 rect 是数组中的每个条目，按顺序排列。
When you call forEach on an array, the code in forEach calls the function you pass it "for each" entry in the array, passing the entry to the function (along with a couple of other things). So rect is each entry in the array, in order.
在内部，省略一些细节， forEach 看起来像这样：
Internally, leaving out some details, forEach looks about like this:
function forEach(callback) {
// Here, `this` is the array `forEach` was called on
for (let index = 0, len = this.length; index < len; ++index) {
callback(this[index], index, this);
// ^^^^^^^^^^^--- this is received by your callback as `rect`
}
}
（为清晰起见，我遗漏的主要细节之一是 forEach 's thisArg 并使用特定的此值调用 callback 。）
(One of the main details I left out for clarity is forEach's thisArg and calling callback with a specific this value.)
实例记录每一步：
function pseudoForEach(callback) {
console.log("Start of pseudoForEach");
for (let index = 0, len = this.length; index < len; ++index) {
console.log(
"Calling callback with: this[index] = " + this[index] +
", index = " + index + ", and this = (the array)"
);
callback(this[index], index, this);
}
console.log("End of pseudoForEach");
}
Object.defineProperty(Array.prototype, "pseudoForEach", {
value: pseudoForEach,
configurable: true,
writable: true
});
var a = ["one", "two", "three"];
console.log("About to call pseudoForEach");
a.pseudoForEach(function(rect) {
console.log("In callback, rect = " + rect);
});
console.log("Done with pseudoForEach call");
.as-console-wrapper {
max-height: 100% !important;
}
我第二次 Jaromanda X的推荐， MDN 是JavaScript信息（和HTML）的良好资源和CSS）。
I second Jaromanda X's recommendation, MDN is a good resource for JavaScript information (and HTML and CSS).
这篇关于JavaScript函数参数 - 初学者问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
