FreecodeCamp刷题答案及知识点（JavaScript调试）

调式

使用控制台检查变量值
Chrome 和 Firefox 都有出色的 JavaScript 控制台（也称为 DevTools），可以用来调试 JavaScript 代码。
console.log() 方法可能是最有用的调试工具，它可以将括号中的内容输出到控制台。 将它放在代码中的关键点可以显示变量在当时的值。 在查看输出之前，最好先想清楚输出应该是什么。 在整个代码中使用检查点来查看计算状态将有助于缩小问题的范围。
使用 console.log() 方法打印代码中记录的变量 a 的值。

let a = 5;
let b = 1;
a++;
// 只修改这一行下面的代码
console.log(a);

let sumAB = a + b;
console.log(sumAB);

了解 freeCodeCamp 和浏览器控制台之间的差异
如果你想看到每次测试的日志，运行测试，并打开浏览器控制台。 如果你喜欢使用浏览器控制台，想要它模仿 freeCodeCamp 控制台，请在其他 console 调用前加上 console.clear()，以清除浏览器控制台。
首先，使用 console.log 打印 output 变量。 然后使用 console.clear 清除浏览器控制台。

// 打开你的浏览器控制台。
let output = "Get this to log once in the freeCodeCamp console and twice in the browser console";
// 使用 console.log() 打印输出变量
 console.log(output);
// 运行测试，查看两个控制台的差异。
console.clear();
// 现在，在 console.log() 之前添加 console.clear()，清除浏览器控制台的内容，通过测试。

使用 type of 检查变量的类型
可以使用 typeof 检查变量的数据结构或类型。 在处理多种数据类型时，这会对调试很有帮助。 如果想计算两数之和，但实际传入了一个字符串参数，则结果可能是错误的。 类型错误可能隐藏在计算或函数调用中。 当你以 JavaScript 对象（JSON）的形式访问和使用外部数据时尤其要小心。

下面是使用 typeof 的一些示例：

console.log(typeof "");
console.log(typeof 0);
console.log(typeof []);
console.log(typeof {});

控制台将按顺序显示字符串 string、number、object 和 object。

JavaScript 有六种原始（不可变）数据类型：Boolean、Null、Undefined、Number、String 和 Symbol（ES6 中新增的），和一种可变的数据类型：Object。 注意：在 JavaScript 中，数组在本质上是一种对象。

添加两个 console.log() 语句来检查代码中的两个变量 seven 和 three 的 typeof 值。

let seven = 7;
let three = "3";
console.log(seven + three);
// 只修改这一行下面的代码
console.log(typeof seven);
console.log(typeof three);

捕获拼错的变量名和函数名

console.log() 和 typeof 方法是检查中间值和程序输出类型的两种主要方法。 现在是时候了解一下 bug 出现的常见的情形。 一个语法级别的问题是打字太快带来的低级拼写错误。

变量或函数名的错写、漏写或大小写弄混都会让浏览器尝试查找并不存在的东西，并报出“引用错误”。 JavaScript 变量和函数名称区分大小写。

捕获未闭合的括号、方括号、大括号和引号
要注意的另一个语法错误是所有的小括号、方括号、花括号和引号都必须配对。 当你编辑代码并插入新代码其中带有括号时，很容易忘记括号闭合。 此外，在将代码块嵌套到其他代码块时要小心，例如将回调函数作为参数添加到方法中。

捕捉单引号和双引号的混合用法
修复字符串，使其对 href 值使用不同的引号，或者转义现有的引号。 在整个字符串周围保留双引号。

let innerHtml = "<p>Click here to <a href=\"#Home\">return home</a></p>";
console.log(innerHtml);

捕获使用赋值运算符而不是相等运算符
如前面的挑战所述，JavaScript 中的赋值运算符 (=) 是用来为变量名赋值的。 并且 == 和 === 运算符检查相等性（三等号 === 是用来测试是否严格相等的，严格相等的意思是值和类型都必须相同）。
修复条件语句，以便程序运行正确的分支，并给 result 赋正确的值。

let x = 7;
let y = 9;
let result = "to come";

if(x == y) {
  result = "Equal!";
} else {
  result = "Not equal!";
}

console.log(result);

捕捉函数调用后缺少的左括号和右括号
当函数或方法不接受任何参数时，你可能忘记在调用它时加上空的左括号和右括号。 通常，函数调用的结果会保存在变量中，供其他代码使用。 可以通过将变量值（或其类型）打印到控制台，查看输出究竟是一个函数引用还是函数调用的返回值来检测这类错误。

function myFunction() {
  return "You rock!";
}
let varOne = myFunction;
let varTwo = myFunction();

这里 varOne 是函数 myFunction ，varTwo 是字符串 You rock!

调用函数时，捕获以错误顺序传递的参数

函数 raiseToPower 返回基数 (base) 的指数 (exponent) 次幂。 不幸的是，它没有被正确调用 — 修改代码，使 power 的值为 8。

function raiseToPower(b, e) {
  return Math.pow(b, e);
}

let base = 2;
let exp = 3;
let power = raiseToPower(base, exp);//修改这一行
console.log(power);

捕获使用索引的时候出现的错误

当试图访问字符串或数组的特定索引（分割或访问一个片段）或循环索引时，有时会出现 Off by one errors 错误（有时称为 OBOE）。 JavaScript 索引从 0 开始，而不是 1，这意味着最后一个索引总会比字符串或数组的长度少 1。 如果尝试访问等于长度的索引，程序可能会抛出“索引超出范围”引用错误或打印出 undefined。
修复以下函数中的两个索引错误，将 1 到 5 之间（包含 1 和 5）的所有数字打印到控制台。

function countToFive() {
  let firstFive = "12345";
  let len = firstFive.length;
  // 只修改这一行下面的代码
  for (let i = 0; i <len; i++) {
  // 只修改这一行上面的代码
    console.log(firstFive[i]);
  }
}

countToFive();

重新初始化循环中的变量时要小心

有时需要在循环中保存信息以增加计数器或重置变量。 一个潜在的问题是变量什么时候该重新初始化，什么时候不该重新初始化，反之亦然。 如果你不小心重置了用于终止条件的变量，导致无限循环，这将特别危险。

使用console.log()在每个循环中打印变量值可以发现与重置相关的错误或者重置变量失败。

以下函数应该创建一个具有m行和n列“零”的二维数组。 不幸的是，它没有产生预期的输出，因为row变量没有在外部循环中重新初始化（设置回空数组）。 修改代码，使其正确地返回包含 3 行 2 列“零”的二维数组，即[[0, 0], [0, 0], [0, 0]]。

function zeroArray(m, n) {
  // 创建一个二维数组，有 m 行 n 列，元素均为 0
  let newArray = [];
  let row = [];
  for (let i = 0; i < m; i++) {
    // 添加第 m 行到 newArray

    for (let j = 0; j < n; j++) {
      // 将 n 个 0 推入当前行以创建列
      row.push(0);
    }
    // 将当前行（已有 n 个 0）推送到数组
    
    newArray.push(row);
    row=[];
  }
  return newArray;
}

let matrix = zeroArray(3, 2);
console.log(matrix);

使用有效的终止条件防止无限循环
myFunc()函数包含一个无限循环，因为终止条件i != 4永远不会为false(并中断循环) -i将每次递增 2，然后跳过 4，因为i是从奇数开始递增。 在终端条件中输入比较运算符，使循环仅在i小于或等于 4 的情况下运行。

function myFunc() {
  for (let i = 1; i <= 4; i += 2) {
    console.log("Still going!");
  }
}