JavaScript笔记

10.在JavaScript中，对象是一种无序的数据集合，以键值对的形式存储数据。对象的属性和方法可以通过点号或方括号访问。

例如，创建一个空对象：

var obj = {};

通过点号访问对象属性：

var name = obj.name;

通过方括号访问对象属性：

var age = obj['age'];

添加对象属性：

obj.name = '张三';
obj['age'] = 25;

删除对象属性：

delete obj.name;

检查对象是否具有某个属性：

if ('name' in obj) {
  console.log('对象有name属性');
}

在JavaScript中，可以使用addEventListener方法为元素添加事件监听器。这个方法接受两个参数：事件类型（如"click"、"mouseover"等）和要执行的回调函数。当指定的事件发生时，回调函数将被调用。

以下是一个简单的示例，演示如何使用addEventListener方法为按钮添加点击事件监听器：

// 获取按钮元素
var button = document.getElementById("myButton");

// 定义点击事件的回调函数
function handleClick() {
  alert("按钮被点击了！");
}

// 为按钮添加点击事件监听器
button.addEventListener("click", handleClick);

在JavaScript中，异步编程是一种处理程序执行顺序的方式，它允许程序在等待某个操作完成时继续执行其他任务。这可以提高程序的性能，特别是在处理大量数据或进行网络请求时。

1. 回调函数：回调函数是一种常见的异步编程方式，它将一个函数作为参数传递给另一个函数，当异步操作完成时，调用这个函数。

function asyncFunction(callback) {
  // 异步操作
  setTimeout(function() {
    callback('异步操作完成');
  }, 1000);
}

asyncFunction(function(result) {
  console.log(result); // 输出 "异步操作完成"
});

2. Promises：Promises是ES6引入的一种用于处理异步操作的对象。它有三种状态：pending（待定）、fulfilled（已成功）和rejected（已失败）。Promises提供了then方法来处理异步操作的结果，以及catch方法来处理错误。

function asyncFunction() {
  return new Promise(function(resolve, reject) {
    // 异步操作
    setTimeout(function() {
      resolve('异步操作完成');
    }, 1000);
  });
}

asyncFunction().then(function(result) {
  console.log(result); // 输出 "异步操作完成"
}).catch(function(error) {
  console.error(error);
});

3. async/await：async/await是ES7引入的一种更简洁的异步编程方式。它使用async关键字定义一个异步函数，然后使用await关键字等待异步操作的结果。

async function asyncFunction() {
  // 异步操作
  const result = await new Promise(function(resolve, reject) {
    setTimeout(function() {
      resolve('异步操作完成');
    }, 1000);
  });

  console.log(result); // 输出 "异步操作完成"
}

asyncFunction();

在JavaScript中，原型链是通过原型对象实现的。每个对象都有一个指向其原型对象的指针，通过这个指针可以访问到该对象的所有属性和方法。原型链的创建过程如下：

1. 创建一个构造函数，用于定义对象的结构。
2. 在构造函数的原型上添加属性和方法。
3. 使用构造函数创建新的对象实例。
4. 新创建的对象实例会继承构造函数原型上的属性和方法。

下面是一个简单的示例：

// 构造函数
function Person(name, age) {
  this.name = name;
  this.age = age;
}

// 在构造函数的原型上添加方法
Person.prototype.sayHello = function() {
  console.log("Hello, my name is " + this.name + " and I am " + this.age + " years old.");
};

// 使用构造函数创建对象实例
var person1 = new Person("Alice", 30);
var 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是一个构造函数，它接受两个参数name和age。我们在Person的原型上添加了一个名为sayHello的方法。当我们使用new Person()创建新的对象实例时，这些实例会自动继承Person原型上的sayHello方法。

例如，以下代码展示了如何使用模板字符串拼接字符串：

const name = "张三";
const age = 25;
const message = `我的名字是${name}，我今年${age}岁。`;
console.log(message); // 输出 "我的名字是张三，我今年25岁。"

1. 创建正则表达式：

   • 使用RegExp对象：const regex = new RegExp('pattern', 'flags');
   • 使用字面量语法：const regex = /pattern/flags;

2. 匹配字符串：

   • match()方法：str.match(regex)，返回一个数组，包含匹配到的结果。如果没有匹配到任何结果，返回null。
   • exec()方法：regex.exec(str)，在字符串中查找匹配项，返回一个数组，包含匹配到的结果。如果没有匹配到任何结果，返回null。

3. 搜索字符串：

   • search()方法：str.search(regex)，返回匹配到的第一个结果的索引，如果没有匹配到任何结果，返回-1。

4. 替换字符串：

   • replace()方法：str.replace(regex, 'replacement')，将匹配到的所有结果替换为指定的字符串，并返回替换后的字符串。

示例代码：

// 创建正则表达式
const regex = /hello/i;

// 匹配字符串
const str1 = 'Hello, world!';
const result1 = str1.match(regex); // ['Hello']
const result2 = regex.exec(str1); // ['Hello']

// 搜索字符串
const result3 = str1.search(regex); // 0

// 替换字符串
const result4 = str1.replace(regex, 'Hi'); // 'Hi, world!'

1. 创建Date对象：
   可以使用构造函数创建Date对象，如下所示：

   const date = new Date();
   

   这将创建一个表示当前日期和时间的Date对象。

2. 获取日期和时间的各个部分：
   可以使用getter方法获取日期和时间的各个部分，如下所示：

   const year = date.getFullYear(); // 获取年份
   const month = date.getMonth() + 1; // 获取月份（注意：月份是从0开始的，所以需要加1）
   const day = date.getDate(); // 获取日期
   const hours = date.getHours(); // 获取小时
   const minutes = date.getMinutes(); // 获取分钟
   const seconds = date.getSeconds(); // 获取秒数
   

3. 设置日期和时间的各个部分：
   可以使用setter方法设置日期和时间的各个部分，如下所示：

   date.setFullYear(year); // 设置年份
   date.setMonth(month - 1); // 设置月份（注意：月份是从0开始的，所以需要减1）
   date.setDate(day); // 设置日期
   date.setHours(hours); // 设置小时
   date.setMinutes(minutes); // 设置分钟
   date.setSeconds(seconds); // 设置秒数
   

4. 格式化日期和时间：
   可以使用toLocaleString、toDateString等方法将Date对象格式化为字符串，如下所示：

   const formattedDate = date.toLocaleDateString(); // 格式化为本地日期字符串
   const formattedTime = date.toLocaleTimeString(); // 格式化为本地时间字符串

1. Math对象提供的一些数学常数：

   • PI：圆周率π，约等于3.141592653589793
   • E：自然对数的底数，约等于2.718281828459045
   • LN2：自然对数2的值，约等于0.6931471805599453
   • LN10：自然对数10的值，约等于2.302585092994046

2. Math对象提供的一些数学函数：

   • sqrt(x)：返回x的平方根
   • pow(x, y)：返回x的y次方
   • abs(x)：返回x的绝对值
   • max(a, b, c, ...)：返回a、b、c等中的最大值
   • min(a, b, c, ...)：返回a、b、c等中的最小值

3. Math对象提供的一些数学计算方法：

   • Math.floor(x)：返回小于或等于x的最大整数
   • Math.ceil(x)：返回大于或等于x的最小整数
   • Math.round(x)：返回四舍五入后的整数
   • Math.random()：返回一个0到1之间的随机数（包括0，不包括1）

JSON是一种数据格式，它使用键值对来表示数据。在JavaScript中，可以使用JSON.stringify()方法将JavaScript对象转换为JSON字符串，使用JSON.parse()方法将JSON字符串转换为JavaScript对象。
以下是一个简单的示例代码：

// 创建一个JavaScript对象
var obj = {
  "name": "John",
  "age": 30,
  "city": "New York"
};

// 将JavaScript对象转换为JSON字符串
var jsonString = JSON.stringify(obj);
console.log(jsonString); // 输出：{"name":"John","age":30,"city":"New York"}

// 将JSON字符串转换为JavaScript对象
var parsedObj = JSON.parse(jsonString);
console.log(parsedObj); // 输出：{ name: 'John', age: 30, city: 'New York' }

在上面的示例中，我们首先创建了一个JavaScript对象obj，然后使用JSON.stringify()方法将其转换为JSON字符串jsonString。接着，我们使用JSON.parse()方法将JSON字符串转换回JavaScript对象parsedObj。