📜  编程 javascript (1)

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

编程JavaScript

JavaScript 是一门在网页中实现交互的高级编程语言。它主要用于开发 Web 应用程序和动态网页,可以与 HTML 和 CSS 配合使用。

基本语法

JavaScript 包含了以下基本语法:

1. 变量声明

可以使用 var、let 或 const 关键字来声明变量。如下所示:

var x = 5;
let y = 10;
const z = 15;
2. 数据类型

JavaScript 包含了多种数据类型,如:字符串、数字、布尔值、数组、对象、空(null)、未定义(undefined)等。可以使用 typeof 关键字来确定变量的类型。如下所示:

var str = "Hello World!";
var num = 42;
var bool = true;
var arr = [1, 2, 3];
var obj = { name: "John", age: 25 };
var empty = null;
var undef;
console.log(typeof str);
console.log(typeof num);
console.log(typeof bool);
console.log(typeof arr);
console.log(typeof obj);
console.log(typeof empty);
console.log(typeof undef);
3. 运算符

JavaScript 可以使用多种运算符,如:算术运算符、比较运算符、逻辑运算符、条件(三元)运算符、赋值运算符等。如下所示:

var x = 5;
var y = 10;
console.log(x + y);
console.log(x - y);
console.log(x * y);
console.log(x / y);
console.log(x % y);
console.log(x == y);
console.log(x != y);
console.log(x > y);
console.log(x < y);
console.log(x >= y);
console.log(x <= y);
console.log(x && y);
console.log(x || y);
console.log(x ? "x 大于 y" : "y 大于 x");
4. 条件语句

JavaScript 可以使用 if...else、switch、三元运算符等语句来控制程序的流程。如下所示:

var x = 5;
if (x > 10) {
  console.log("x 大于 10");
} else if (x < 5) {
  console.log("x 小于 5");
} else {
  console.log("x 等于 5");
}

var fruit = "apple";
switch (fruit) {
  case "banana":
    console.log("这是一个香蕉");
    break;
  case "apple":
    console.log("这是一个苹果");
    break;
  default:
    console.log("这不是水果");
}

var result = x > y ? "x 大于 y" : "y 大于 x";
console.log(result);
5. 循环语句

JavaScript 可以使用 for、while、do...while 等语句来实现循环。如下所示:

for (var i = 1; i <= 5; i++) {
  console.log(i);
}

var i = 1;
while (i <= 5) {
  console.log(i);
  i++;
}

var i = 1;
do {
  console.log(i);
  i++;
} while (i <= 5);
高级特性
1. 函数

JavaScript 中的函数可以像变量一样定义和传递,可以用于封装可重复使用的代码块。如下所示:

function add(x, y) {
  return x + y;
}

var result = add(5, 10);
console.log(result);
2. 对象

JavaScript 中的对象是一种复合数据类型,可以用于封装数据和行为。可以使用对象字面量、构造函数、类等方式创建对象。如下所示:

var car = {
  make: "Toyota",
  model: "Camry",
  year: 2020,
  drive: function() {
    console.log("正在开车");
  }
};

console.log(car.make);
console.log(car.model);
console.log(car.year);
car.drive();
3. 数组

JavaScript 中的数组可以用于存储多个值,可以使用数组字面量、构造函数等方式创建数组。可以使用索引来访问数组元素,也可以使用 foreach 等方法遍历数组。如下所示:

var fruits = ["apple", "banana", "orange", "grape"];
console.log(fruits[0]);
console.log(fruits[1]);
console.log(fruits[2]);
console.log(fruits[3]);

fruits.forEach(function(item, index, array) {
  console.log(item);
});
4. 异步编程

JavaScript 可以使用回调函数、Promise、async/await 等方式实现异步编程,可以处理耗时操作而不会阻塞程序的执行。如下所示:

// 回调函数
function fetchData(callback) {
  setTimeout(function() {
    callback("Hello World!");
  }, 1000);
}

fetchData(function(result) {
  console.log(result);
});

// Promise
function fetchData() {
  return new Promise(function(resolve, reject) {
    setTimeout(function() {
      resolve("Hello World!");
    }, 1000);
  });
}

fetchData()
  .then(function(result) {
    console.log(result);
  })
  .catch(function(error) {
    console.error(error);
  });

// async/await
async function fetchData() {
  return new Promise(function(resolve, reject) {
    setTimeout(function() {
      resolve("Hello World!");
    }, 1000);
  });
}

async function main() {
  var result = await fetchData();
  console.log(result);
}

main();
总结

JavaScript 是一门强大的编程语言,具有丰富的语法和高级特性,是开发 Web 应用程序和动态网页的必备工具。学习和掌握 JavaScript,可以极大地提高开发效率和程序的质量。