📜  迄今为止的 javascript (1)

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

迄今为止的 JavaScript

Javascript Logo

自1995年以来JavaScript语言诞生以来,JS已经成为了世界上最流行的编程语言之一。不仅在前端开发领域,JS也在后端、游戏开发以及移动端得到了广泛的应用。

语法

JS的语法相对简单,与C语言类似,但是它具有很强的灵活性。它支持面向对象编程、函数式编程等多种编程范式。

Hello World

让我们来看一个最基本的JS程序,打印"Hello World!"到控制台:

console.log("Hello World!");
数据类型

JS支持多种数据类型,包括数字、字符串、布尔值、对象、数组、函数等。

// 数字类型
let num = 123;
console.log(num);

// 字符串类型
let str = "Hello";
console.log(str);

// 布尔值类型
let flag = true;
console.log(flag);

// 对象类型
let person = {
    name: "Alice",
    age: 30
};
console.log(person);

// 数组类型
let array = [1, 2, 3];
console.log(array);

// 函数类型
function add(a, b) {
    return a + b;
}
console.log(add(2, 3));
条件语句

JS中常用的条件语句有if/else、switch语句等。

// if/else语句
let age = 18;
if (age >= 18) {
    console.log("成年人");
} else {
    console.log("未成年人");
}

// switch语句
let fruit = "apple";
switch (fruit) {
    case "apple":
        console.log("这是一个苹果");
        break;
    case "banana":
        console.log("这是一个香蕉");
        break;
    default:
        console.log("未知的水果");
}
循环语句

JS中的循环语句有for、while、do-while等。

// for循环
for (let i = 1; i <= 5; i++) {
    console.log(i);
}

// while循环
let i = 1;
while (i <= 5) {
    console.log(i);
    i++;
}

// do-while循环
i = 1;
do {
    console.log(i);
    i++;
} while (i <= 5);
前端开发

JS最广泛的应用领域就是前端开发。在前端开发中,JS通常与HTML、CSS一起使用,用于实现网页的动态效果和交互。

DOM操作

JS中最重要的一个概念是DOM(Document Object Model)。DOM是指网页文档对象模型,它提供了一种把HTML文档呈现为一个树形结构的方式,并且定义了一套操作这个结构的API。通过DOM操作,我们可以对网页中的元素进行增删改查,从而实现动态网页的效果。

// 通过id获取元素
let element = document.getElementById("my-element");

// 获取元素的子节点
let children = element.children;

// 修改元素的样式
element.style.color = "red";

// 添加事件监听器
element.addEventListener("click", function() {
    console.log("点击了元素");
});

// 在元素内添加新元素
let newNode = document.createElement("p");
let textNode = document.createTextNode("这是一个段落");
newNode.appendChild(textNode);
element.appendChild(newNode);
后端开发

除了前端开发,JS也可以用于后端开发。通过使用Node.js框架,我们可以在服务器端使用JS进行开发,从而实现服务器端的应用程序。

const http = require("http");

http.createServer(function (req, res) {
  res.writeHead(200, {"Content-Type": "text/plain"});
  res.end("Hello World!\n");
}).listen(8080);

console.log("Server running at http://127.0.0.1:8080/");
移动端开发

JS也可以用于移动端开发。通过使用React Native框架,我们可以使用JS进行移动端应用程序的开发。React Native提供了一种基于JS的开发方式,开发者可以通过JS代码描述用户界面,从而实现跨平台的移动应用程序。

import React, { Component } from "react";
import { Text, View } from "react-native";

export default class App extends Component {
  render() {
    return (
      <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
        <Text>Hello World!</Text>
      </View>
    );
  }
}

总之,迄今为止的JS已经有了非常广泛的应用范围和生态体系,它不仅可以用于Web开发,也可以用于桌面程序、移动应用程序等领域。未来也有很大的发展空间和潜力。