前端开发必备：JavaScript 基础知识（四）

在上一篇📕前端开发必备：JavaScript 基础知识（三）中，我们探讨了 JavaScript 中的数据类型转换，了解了如何通过 Number()、String() 和 Boolean() 等方法在不同类型之间进行转换。这些基础知识为我们处理数据提供了更多的灵活性。

在本篇中，我们将继续深入 JavaScript 的基础，介绍弹框、控制台打印、prompt 输入的使用，以及数组和对象的基本操作。这些内容是 JavaScript 编程中不可或缺的部分，能够帮助我们更好地与用户交互并组织数据。让我们开始吧！

---

1. 弹框与控制台打印

1.1 alert弹框

alert 是 JavaScript 中最简单的弹框函数，用于向用户显示一条消息。以下是一个简单的例子：

 // 1 弹框
    var name = "JavaScript"
    alert(name)

效果： 

1.2 console.log 控制台打印

console.log 是开发者常用的调试工具，它可以将信息打印到浏览器的控制台。例如：

// 2 控制台直接打印
    console.log(name);
    console.log("好喜欢学js！");

效果：

1.3 prompt 弹框输入

prompt 函数用于弹出一个对话框，提示用户输入信息。用户输入的内容会被保存并返回。例如：

// 3 prompt 弹框输入语句，输入后的东西会被这个函数代码保存，然后返回
    var n = prompt("最喜欢学的课程是？")
    console.log(n);
    alert(n);

 效果：

2. 数组的基本知识

数组是 JavaScript 中用于存储多个值的数据结构。数组中的每个值都有一个索引，索引从 0 开始。

2.1 创建数组

可以使用方括号 [] 来创建一个数组：

  var dogs = ["拉布拉多","金毛","边牧","哈士奇","比熊","泰迪"]
  console.log(dogs);

定义后并在控制台打印，效果：

2.2 访问数组元素

可以通过索引访问数组中的元素：

var dogs = ["拉布拉多","金毛","边牧","哈士奇","比熊","泰迪"]
console.log(dogs[0]);
console.log(dogs[5]);

效果如图：

 

2.3 修改数组元素

可以通过索引修改数组中的元素：

var dogs = ["拉布拉多","金毛","边牧","哈士奇","比熊","泰迪"]
dogs[2]="阿拉斯加"
dogs[4]="西高地"
console.log(dogs);

效果：

2.4 数组的常用方法

• push：向数组末尾添加一个元素。

• pop：删除数组末尾的元素。

• length：获取数组的长度。

var dogs = ["拉布拉多","金毛","边牧","哈士奇","比熊","泰迪"]
dogs.push("阿拉斯加")
console.log(dogs)

dogs.pop();
console.log(dogs); 

console.log(dogs.length);

效果：

 

3. 对象的基本知识

对象是 JavaScript 中用于存储键值对的数据结构。对象中的每个键都对应一个值，键和值之间用冒号 : 分隔。

3.1 创建对象

可以使用花括号 {} 来创建一个对象：

var dog = {
        name: "莱芙",
        breed: "拉布拉多",
        age: 1
      };

3.2 访问对象属性

可以通过点号 . 或方括号 [] 访问对象的属性：

 console.log(dog.name); // 输出 "莱芙"
 console.log(dog["breed"]); // 输出 "拉布拉多"

效果：

3.3 修改对象属性

可以通过点号 . 或方括号 [] 修改对象的属性：

dog.age = 4;
dog["breed"] = "金毛";
console.log(dog); // 输出 { name: "莱芙", breed: "金毛", age: 4 }

3.4 对象的常用方法

• Object.keys()：获取对象的所有键。

• Object.values()：获取对象的所有值。

console.log(Object.keys(dog)); // 输出 ["name", "breed", "age"]
console.log(Object.values(dog)); // 输出 ["莱芙", "金毛", 4]

效果：

 

结语

本文介绍了 JavaScript 中的一些基础概念，包括弹框、控制台打印、prompt 输入、数组和对象。掌握这些基础知识是学习 JavaScript 的重要一步。希望本文对你有所帮助！