从零开始学习JavaScript:轻松掌握编程语言的核心技能⑥
- 1. JavaScript 对象
- 2. JavaScript 类
- 3. JavaScript prototype(原型对象)
- 4. prototype 继承
- 5. JavaScript Number 对象
- 5.1 JavaScript 数字
- 6. JavaScript 字符串(String) 对象
- 6.1 JavaScript 字符串
- 7. JavaScript Date(日期) 对象
🏘️🏘️个人简介:以山河作礼。
🎖️🎖️:Python领域新星创作者,CSDN实力新星认证,阿里云社区专家博主
🎁🎁:Web全栈开发专栏:《Web全栈开发》免费专栏,欢迎阅读!
🎁🎁:文章末尾扫描二维码可以加入粉丝交流群。
1. JavaScript 对象
📑📑JavaScript 对象是一种复合数据类型,它可以存储多个键值对。每个键值对都是一个属性,其中键是属性的名称,值可以是任何 JavaScript 数据类型,包括其他对象。对象可以用字面量或构造函数创建。
📌 例如,以下是一个使用字面量创建的简单对象:
let person = {
name: "Alice",
age: 30,
job: "Developer"
};
person 是一个对象,它有三个属性:name、age 和 job。
📌 你可以通过点符号或方括号访问这些属性的值,例如:
console.log(person.name); // 输出 "Alice"
console.log(person["age"]); // 输出 30
你还可以动态地添加、修改或删除对象的属性,例如:
person.city = "Shanghai"; // 添加一个新属性
person.age = 31; // 修改属性的值
delete person.job; // 删除一个属性
JavaScript 对象是非常灵活的,可以用于各种用途,例如表示真实世界中的事物、存储配置信息、实现数据结构等等。
2. JavaScript 类
📑📑JavaScript 类是一种语言特性,它是一种用于创建对象的模板或蓝图。类定义了对象的属性和方法,从而定义了对象的行为。类可以看作是一种自定义的数据类型,可以用来创建多个具有相似属性和方法的对象。
📌 在 JavaScript 中,类可以使用 class 关键字来定义。例如,以下是一个简单的类定义:
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
sayHello() {
console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
}
}
我们定义了一个名为 Person 的类,它有两个属性:name 和 age,以及一个方法 sayHello。构造函数 constructor
用于初始化对象的属性,而方法 sayHello 用于输出对象的信息。
📌 我们可以使用 new 关键字来创建 Person 类的实例:
let person1 = new Person("Alice", 30);
let person2 = new Person("Bob", 25);
person1.sayHello(); // 输出 "Hello, my name is Alice and I am 30 years old."
person2.sayHello(); // 输出 "Hello, my name is Bob and I am 25 years old."
我们创建了两个 Person 类的实例:person1 和 person2。每个实例都有自己的 name 和 age 属性,并且可以调用
sayHello 方法来输出自己的信息。
3. JavaScript prototype(原型对象)
- 在 JavaScript 中,每个对象都有一个原型对象(prototype),原型对象是一个普通的对象,它包含了对象的属性和方法。
- 当你访问一个对象的属性或方法时,如果该对象本身没有这个属性或方法,JavaScript 就会在它的原型对象中查找,如果原型对象中也没有找到,就会继续查找原型对象的原型对象,直到找到为止,这就是所谓的原型链(prototype
chain)。
📌 可以使用 Object.getPrototypeOf() 方法来获取一个对象的原型对象,例如:
let person = {
name: "Alice",
age: 30
};
let proto = Object.getPrototypeOf(person);
console.log(proto); // 输出 {}
创建了一个名为 person 的对象,它有两个属性:name 和 age。然后,我们使用 Object.getPrototypeOf()
方法获取 person 对象的原型对象,它是一个空对象 {}。
📌 你可以使用对象字面量的方式来指定一个对象的原型对象,例如:
let proto = {
sayHello() {
console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
}
};
let person = {
name: "Alice",
age: 30
};
Object.setPrototypeOf(person, proto);
person.sayHello(); // 输出 "Hello, my name is Alice and I am 30 years old."
创建了一个名为 proto 的对象,它有一个方法 sayHello。然后,我们使用 Object.setPrototypeOf() 方法将
person 对象的原型对象设置为 proto 对象,这样,person 对象就可以调用 sayHello 方法了。
4. prototype 继承
📑📑在 JavaScript 中,原型继承是一种实现继承的方式,它可以让一个对象继承另一个对象的属性和方法。在原型继承中,一个对象的原型对象就是它的父对象,它可以继承父对象的属性和方法。
📌 在 JavaScript 中,可以使用 prototype 属性来指定一个对象的原型对象。例如,以下是一个简单的原型继承例子:
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype.sayHello = function () {
console.log(Hello, my name is <span class="hljs-subst">${<span class="hljs-variable language_">this</span>.name}</span> and I am <span class="hljs-subst">${<span class="hljs-variable language_">this</span>.age}</span> years old.);
};
function Student(name, age, major) {
Person.call(this, name, age);
this.major = major;
}
Student.prototype = Object.create(Person.prototype);
Student.prototype.constructor = Student;
Student.prototype.sayMajor = function () {
console.log(My major is <span class="hljs-subst">${<span class="hljs-variable language_">this</span>.major}</span>.);
};
let student = new Student("Alice", 20, "Computer Science");
student.sayHello(); // 输出 "Hello, my name is Alice and I am 20 years old."
student.sayMajor(); // 输出 "My major is Computer Science."
我们定义了一个名为 Person 的构造函数,它有一个方法 sayHello。然后,我们定义了一个名为 Student 的构造函数,它继承了
Person 的属性和方法,并且有一个自己的方法 sayMajor。我们使用 Object.create() 方法来创建 Student
的原型对象,并将它设置为 Person 的原型对象,这样,Student 就可以继承 Person 的属性和方法了。
5. JavaScript Number 对象
5.1 JavaScript 数字
-
JavaScript 中的数字是一种数据类型,用于表示数值。JavaScript 中的数字类型包括整数和浮点数,它们都是
Number类型的实例。 -
JavaScript 中的数字类型是动态类型,这意味着你可以在任何时候将一个变量的值设置为一个数字,而不需要指定它的类型。
📌 以下是一些关于 JavaScript 数字的常见问题和答案:
- 如何声明一个数字变量?
可以使用 var、let 或 const 关键字来声明一个数字变量,例如:
var x = 5;
let y = 10;
const z = 15;
- 如何判断一个变量是否为数字?
可以使用 typeof 运算符来判断一个变量的类型,例如:
var x = 5;
if (typeof x === "number") {
console.log("x is a number");
}
- 如何将一个字符串转换为数字?
可以使用 parseInt() 或 parseFloat() 函数将一个字符串转换为数字,例如:
var x = parseInt("10");
var y = parseFloat("3.14");
- 如何将一个数字转换为字符串?
可以使用 toString() 方法将一个数字转换为字符串,例如:
var x = 5;
var y = x.toString();
- 如何判断一个数字是否为整数?
可以使用 Number.isInteger() 方法来判断一个数字是否为整数,例如:
var x = 5;
if (Number.isInteger(x)) {
console.log("x is an integer");
}
- 如何判断一个数字是否为 NaN?
可以使用 isNaN() 函数来判断一个数字是否为 NaN,例如:
var x = NaN;
if (isNaN(x)) {
console.log("x is NaN");
}
6. JavaScript 字符串(String) 对象
6.1 JavaScript 字符串
- JavaScript 中的字符串是一种数据类型,用于表示文本。字符串是由一系列字符组成的,可以包含字母、数字、符号、空格等等。在JavaScript 中,字符串类型被定义为 String 类型。
以下是一些关于 JavaScript 字符串的常见问题和答案:
- 如何声明一个字符串变量?
可以使用 var、let 或 const 关键字来声明一个字符串变量,例如:
var x = "Hello";
let y = "World";
const z = "!";
- 如何计算一个字符串的长度?
你可以使用 length 属性来计算一个字符串的长度,例如:
var x = "Hello";
var len = x.length;
- 如何访问一个字符串中的字符?
你可以使用方括号和索引来访问一个字符串中的字符,例如:
var x = "Hello";
var firstChar = x[0];
var lastChar = x[x.length-1];
- 如何将一个字符串转换为大写或小写?
你可以使用 toUpperCase() 或 toLowerCase() 方法将一个字符串转换为大写或小写,例如:
var x = "Hello";
var upperCase = x.toUpperCase();
var lowerCase = x.toLowerCase();
- 如何在一个字符串中查找子串?
你可以使用 indexOf() 或 lastIndexOf() 方法在一个字符串中查找子串,例如:
var x = "Hello World";
var index = x.indexOf("World");
var lastIndex = x.lastIndexOf("l");
- 如何将一个字符串转换为数字?
你可以使用 parseInt() 或 parseFloat() 函数将一个字符串转换为数字,例如:
var x = parseInt("10");
var y = parseFloat("3.14");
7. JavaScript Date(日期) 对象
- JavaScript 中的 Date 对象用于处理日期和时间。它提供了一组方法来获取和设置日期和时间,以及执行各种日期和时间操作。
📌 以下是一些关于 JavaScript Date 对象的常见问题和答案:
- 如何创建一个 Date 对象?
可以使用 new 关键字和 Date() 构造函数来创建一个 Date 对象。如果不传递任何参数,则创建的对象将包含当前日期和时间。例如:
var now = new Date();
还可以传递一个表示日期和时间的字符串或数字作为参数来创建 Date 对象。例如:
var christmas = new Date("December 25, 2020");
var epoch = new Date(0);
- 如何获取一个 Date 对象的年、月、日、小时、分钟、秒和毫秒?
可以使用 Date 对象的一系列方法来获取日期和时间的各个部分。例如:
var now = new Date();
var year = now.getFullYear();
var month = now.getMonth();
var day = now.getDate();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds();
var milliseconds = now.getMilliseconds();
- 如何设置一个 Date 对象的年、月、日、小时、分钟、秒和毫秒?
可以使用 Date 对象的一系列方法来设置日期和时间的各个部分。例如:
var now = new Date();
now.setFullYear(2021);
now.setMonth(0);
now.setDate(1);
now.setHours(0);
now.setMinutes(0);
now.setSeconds(0);
now.setMilliseconds(0);
- 如何计算两个 Date 对象之间的时间差?
可以使用 Date 对象的 getTime() 方法来获取从 1970 年 1 月 1 日 00:00:00 UTC 到指定日期的毫秒数,然后计算两个日期之间的差值。例如:
var now = new Date();
var christmas = new Date("December 25, 2020");
var timeDiff = christmas.getTime() - now.getTime();
var daysDiff = Math.floor(timeDiff / (1000 * 60 * 60 * 24));
- 如何将一个 Date 对象格式化为字符串?
可以使用 Date 对象的toDateString()toLocaleDateString()、toTimeString()、toLocaleTimeString()、toString() 和 toLocaleString() 方法将一个 Date 对象格式化为字符串。例如:
var now = new Date();
var dateString = now.toDateString();
var timeString = now.toTimeString();
var dateTimeString = now.toLocaleString();