gpt4 book ai didi

javascript - 为什么取出代码片段 '.prototype' 会导致我的 javascript 在这里不起作用?

转载 作者:行者123 更新时间:2023-11-30 07:29:02 25 4
gpt4 key购买 nike

在以下函数中,如果我删除“.prototype”部分,函数将停止工作。

imageClock.display.prototype.update = function() {
var dateObj = new Date();
var currentTime = dateObj.getHours() + ":" + dateObj.getMinutes() + ":" + dateObj.getSeconds();
var currentTimeHTML = imageClock.imageHTML(currentTime) + '<img src="' + ((dateObj.getHours() >=12) ? imageClock.digits[11] : imageClock.digits[10]) + '" />';
document.getElementById(this.spanId).innerHTML = currentTimeHTML;
}

我不明白的是我没有将原型(prototype)框架用作我的代码的一部分。我的 html 文件链接到的唯一文件是包含此代码的 javascript 文件。 (下面的完整代码;文件的名称是 clock3.js,位于名为“javascript”的文件夹中,这是我的 html 文件指向/链接到的唯一 javascript 文件。)

var imageClock = new Object();

imageClock.digits = ["images/clock/0.gif", "images/clock/1.gif", "images/clock/2.gif", "images/clock/3.gif", "images/clock/4.gif", "images/clock/5.gif", "images/clock/6.gif", "images/clock/7.gif", "images/clock/8.gif", "images/clock/9.gif", "images/clock/am.gif", "images/clock/pm.gif", "images/clock/colon.gif"];

imageClock.instances = 0;

var preLoadImages = [];

// preloads javascript images
for (var i = 0; i < imageClock.digits.length; i++) {
preLoadImages[i] = new Image();
preLoadImages[i].src = imageClock.digits[i];
}

imageClock.imageHTML = function(timeString) {
var sections = timeString.split(":");

// makes the hour digit either 12pm or 1pm depending on what time it is so that 0am or 13pm doesn't appear
if (sections[0] == "0") {
sections[0] = "12";
} else if (sections[0] >= 13) {
sections[0] = sections[0] - 12 + "";
}
for (var i = 0; i < sections.length; i++) {
if (sections[i].length == 1) {
sections[i] = '<img src="' + imageClock.digits[0] + '" />' + '<img src="' + imageClock.digits[parseInt(sections[i])] + '" />';
} else {
sections[i] = '<img src="' + imageClock.digits[parseInt(sections[i].charAt(0))] + '" />' + '<img src="' + imageClock.digits[parseInt(sections[i].charAt(1))] + '" />';
}
}

// section[0] indicates hours, the image tag is the colons, sections[1] indicates the second part which is the minutes, and sections[2] indicates seconds. delete sections[2] and the seconds part of the clock will disappear.
return sections[0] + '<img src="' + imageClock.digits[12] + '" />' + sections[1] + '<img src="' + imageClock.digits[12] + '" />' + sections[2];
}

imageClock.display = function() {
var clockInstance = this;
this.spanid = "clockSpan" + (imageClock.instances++);
document.write('<span id = "' + this.spanId + '"></span>');
this.update();
setInterval(function() {clockInstance.update()}, 1000);
}

imageClock.display.prototype.update = function() {
var dateObj = new Date();
var currentTime = dateObj.getHours() + ":" + dateObj.getMinutes() + ":" + dateObj.getSeconds();
var currentTimeHTML = imageClock.imageHTML(currentTime) + '<img src="' + ((dateObj.getHours() >=12) ? imageClock.digits[11] : imageClock.digits[10]) + '" />';
document.getElementById(this.spanId).innerHTML = currentTimeHTML;
}

使用这段javascript代码显示一个简单时钟的html文件如下

<html>
<head>
<script type="text/javascript" src="javascript/clock3.js"></script>
<title>Javascript Clock</title>
</head>
<body>
<h1>The Current Time:</h1>
<p><script type="text/javascript">new imageClock.display();</script></p>
</body>
</html>

如您所见,我没有包含原型(prototype)框架,我不明白为什么当我取出“.prototype”部分时代码停止工作

最佳答案

“原型(prototype)”一词在 Javascript 世界中至少以两种有趣的方式使用:

  • 这是一个流行的框架(Prototype)的名字
  • 它是运行时用于定位对象实例的“继承”属性的 Function 实例的属性名称

Function 实例的“原型(prototype)”属性就是这里涉及的内容。它与 Prototype 框架没有任何关系。

当您的代码将属性添加到 Function 实例的“原型(prototype)”对象(此处为“显示”函数,它本身由“imageClock”对象的属性引用)时,它确保对象实例由呼唤

new imageClock.display(/* whatever */)

都将具有可用的“更新”功能(根据您的代码)。您的代码在该计时器处理程序中使用该事实。

关于javascript - 为什么取出代码片段 '.prototype' 会导致我的 javascript 在这里不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4652744/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com