0.练习环境为:microEdge浏览器,控制台为:浏览器按F12。
先新建一个简单的HTML网页,1.html:
<!doctype html>
<html lang="en">
<head>
<title>Dog</title>
<meta charset="utf-8">
</head>
<body>
<script src = "1.js"></script>
</body>
</html>
再新建一个1.js文件,作以下练习(保存到1.js)。
打开1.html,在浏览器F12的JavaScript控制台查看输出。
想深入知道为什么,先看深入浅出HTML与CSS,深入浅出HTML5编程,深入浅出JavaScript语言等书籍,这几天花了时间把这三本书草草看了一遍,大概有些印象。
1. 创建一个记录学生成绩的对象,提供一个添加成绩的方法,以及一个显示学生平均成绩 的方法。
function Student() {
this.scores = [];
this.addScore = addScore;
this.displayAverage = displayAverage;
}
function addScore(score) {
this.scores.push(score);
}
function displayAverage() {
var total = 0;
var average = 0;
if (this.scores.length === 0) {
average = 0;
} else {
total = this.scores.reduce((acc, score) => acc + score);
average = total / this.scores.length;
}
console.log("平均成绩是:" + average.toFixed(2));
}
const student1 = new Student();
student1.addScore(85);
student1.addScore(90);
student1.addScore(88);
student1.displayAverage();
2. 将一组单词存储在一个数组中,并按正序和倒序分别显示这些单词。
var words = ["apple", "banana", "cherry", "date", "elderberry", "fig", "grape", "honeydew", "indigo", "jelly"];
console.log("正序显示单词:");
words.forEach(word => console.log(word));
console.log("\n倒序显示单词:");
words.reverse().forEach(word => console.log(word));
3. 修改本章前面出现过的 weeklyTemps 对象,使它可以使用一个二维数组来存储每月的有 用数据。增加一些方法用以显示月平均数、具体某一周平均数和所有周的平均数。
function weekTemps() {
this.dataStore = [];
this.addWeeklyTemps = addWeeklyTemps;
this.weeklyAverage = weeklyAverage;
this.monthlyAverage = monthlyAverage;
this.overallAverage = overallAverage;
}
function addWeeklyTemps(month, weeklyTemps) {
if (!this.dataStore[month]) {
this.dataStore[month] = [];
}
this.dataStore[month].push(weeklyTemps);
};
function monthlyAverage(month) {
if (!this.dataStore[month] || this.dataStore[month].length === 0) {
return 0;
}
var total = 0;
var count = 0;
for (var i = 0; i < this.dataStore[month].length; i++) {
total += this.weeklyAverage(month, i);
count++;
}
return total / count;
};
function weeklyAverage(month, weekIndex) {
if (!this.dataStore[month] || !this.dataStore[month][weekIndex]) {
return 0;
}
var total = 0;
for (var i = 0; i < this.dataStore[month][weekIndex].length; i++) {
total += this.dataStore[month][weekIndex][i];
}
return total / this.dataStore[month][weekIndex].length;
};
function overallAverage() {
var total = 0;
var count = 0;
for (var month in this.dataStore) {
for (var i = 0; i < this.dataStore[month].length; i++) {
for (var j = 0; j < this.dataStore[month][i].length; j++) {
total += this.dataStore[month][i][j];
count++;
}
}
}
return total / count;
};
var thisWeek = new weekTemps();
thisWeek.addWeeklyTemps(0, [52, 55, 61, 65, 55, 50, 52, 49]);
thisWeek.addWeeklyTemps(0, [53, 56, 62, 66, 56, 51, 53, 50]);
thisWeek.addWeeklyTemps(1, [54, 57, 63, 67, 57, 52, 54, 51]);
console.log("第一个月的平均温度:", thisWeek.monthlyAverage(0));
console.log("第二个月的平均温度:", thisWeek.monthlyAverage(1));
console.log("第一个月第一周的平均温度:", thisWeek.weeklyAverage(0, 0));
console.log("第一个月第二周的平均温度:", thisWeek.weeklyAverage(0, 1));
console.log("所有周的平均温度:", thisWeek.overallAverage());
4. 创建这样一个对象,它将字母存储在一个数组中,并且用一个方法可以将字母连在一 起,显示成一个单词。
function LetterStorage() {
this.letters = [];
this.addLetter = addLetter;
this.joinLetters = joinLetters;
}
function addLetter(letter) {
this.letters.push(letter);
}
function joinLetters() {
return this.letters.join("");
}
var wordBuilder = new LetterStorage();
wordBuilder.addLetter('H');
wordBuilder.addLetter('e');
wordBuilder.addLetter('l');
wordBuilder.addLetter('l');
wordBuilder.addLetter('o');
console.log(wordBuilder.joinLetters());