📜  功能<asterisk>在 JS - Javascript (1)

📅  最后修改于: 2023-12-03 15:07:17.629000             🧑  作者: Mango

功能介绍 - JS - Javascript

JavaScript 是一种广泛应用于 Web 上的脚本语言,也可以用于其它环境(如 Node.js 等)。JS 基于 ECMAScript 标准,并且具有面向对象、函数式和事件驱动等特性。下面是 JS 的一些主要功能介绍。

1. DOM 操作

DOM(文档对象模型)是 Web 页面中的节点树形结构。JS 可以通过 DOM 操作修改或者创建节点、修改节点属性或者文本内容,还能够监听节点事件等,如下代码:

// 获取节点
const node = document.getElementById('myId');

// 修改节点文本内容
node.innerHTML = 'Hello World!';

// 创建节点
const newNode = document.createElement('div');
newNode.innerHTML = 'New Node';
node.appendChild(newNode);

// 监听节点事件
node.addEventListener('click', event => { console.log(event)});
2. AJAX

AJAX(异步 JavaScript 和 XML)指的是通过浏览器异步地发送 HTTP 请求和接收响应的技术。在 JS 中,我们可以通过 XMLHttpRequest 对象实现 AJAX 功能,如下代码:

const xhr = new XMLHttpRequest();
xhr.open('GET', 'https://api.com/data', true);
xhr.onload = function() {
  if (xhr.status === 200) {
    console.log(xhr.responseText);
  } else {
    console.error(xhr.statusText);
  }
};
xhr.onerror = function() {
  console.error('Network Error');
};
xhr.send();
3. 函数式编程

JS 将函数作为一等公民,允许函数存在变量中,且函数可以接收和返回其他函数。因此,JS 还可以使用函数作为参数来实现函数式编程,如下代码:

// 函数作为参数
function myFunc(a, b, func) {
  return func(a, b);
}
console.log(myFunc(2, 3, (x, y) => x + y)); // 5

// 函数作为返回值
function myFunc2() {
  return function() {
    console.log('Hello World!');
  }
}
const f = myFunc2();
f(); // 'Hello World!'
4. 类与面向对象编程

JS 支持使用类和面向对象编程,其中 ES6 提供了更好的语法支持,如下代码:

class Animal {
  constructor(name) {
    this.name = name;
  }
  walk() {
    console.log(this.name + ' is walking');
  }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name);
    this.breed = breed;
  }
  bark() {
    console.log(this.name + ' is barking');
  }
}

const myDog = new Dog('Puppy', 'Golden Retriever');
myDog.walk(); // 'Puppy is walking'
myDog.bark(); // 'Puppy is barking'
5. 模块化

JS 可以通过 ES6 的模块化机制,实现模块化开发和导入,如下代码:

// 在 math.js 中定义函数
export function sum(a, b) {
  return a + b;
}

// 在 main.js 中导入模块并调用函数
import { sum } from './math.js';
console.log(sum(2, 3)); // 5

以上是 JS 的一些常用功能介绍,但实际上 JS 还有很多其它特性值得探究。