基础语法

约 725 字大约 2 分钟

2025-03-12

JavaScript 基础语法

变量&常量、数据类型

命名规范：小驼峰命名法。

声明：使用var, let, const（常量）修饰符（let, const为 ES6 语法）。

数据类型：number, string, boolean, null, undefined

变量、常量的声明

let variableNameByVar = 10
let variableNameByLet = 10
let constName = 10

数据类型

let myNum = 10
let myStr = 'this is a string'
let myBool = true // true, false
let myNull = null
let myUndefined

运算符

四则运算（+-*/）
字符串拼接（+）
比较运算符

注

字符串拼接在 ES6 中引入了模板语法，能够很方便地进行字符串格式化。

const name = 'L0v3ch4n'
const age = 18
console.log(`My name is ${name}, I am ${age} years old.`)
// My name is L0v3ch4n, I am 18 years old.

判断两个对象是否相等应该使用===，不同类型之间做==会把两个对象都转化成字符串再进行比较。

console.log(1 == '1') // true
console.log(1 === '1') // false

控制语句

if-else if-else 分支语句

if (condition1) {
  // statement1
}
else if (condition1) {
  // statement2
}
else {
  // statement
}

for 循环

for (variable_statement; condition; end_op) {
  // statement
}

while 循环

while (condition) {
  // statement
}

函数

function

function fn(arguements) {
  // statement
}

箭头函数（ES6）

function fn(arguements) {
  // statement
}

数据结构

数组(Array)

let arr = [1, 2, 3, 4]
console.log(arr.length) // 数组长度
console.log(arr[1]) // 索引取值
arr.push(5) // 添加元素（在后面）
arr.unshift(0) // 添加元素（在前面）

// 遍历数组
for (let i = 0; i < arr.length; i++) {
  console.log(arr[i])
}
for (const item in arr) {
  console.log(item)
}
for (const item of arr) {
  console.log(item)
}
arr.forEach((item) => {
  console.log(item)
})
arr.map((item) => {
  console.log(item)
})

// 筛选
arr.filter((item) => {
  if (item % 2 === 1)
    return item
})

// reduce
arr.reduce((num1, num2) => {
  return num1 + num2
}) // 数组求和

[!note] > 判断数组为空的方法

length属性不为 0
Array.isArray()结合length
for...of / for...in循环遍历
Object.keys()（ES6）
length

// length
const arr = []
if (arr.length === 0) {
  console.log('数组为空')
}
else {
  console.log('数组不为空')
}

@tab Array.isArray()&length

// Array.isArray()结合length
if (Array.isArray(arr) && arr.length === 0) {
  console.log('数组为空')
}
else {
  console.log('数组不为空')
}

@tab for...of / for...in 循环遍历

// for...of / for...in循环遍历
let isEmpty = false
for (const _ of arr) {
  isEmpty = true
  break
}
if (isEmpty) {
  console.log('数组为空')
}
else {
  console.log('数组不为空')
}

@tab Object.keys()

// Object.keys()
if (Object.keys(arr).length === 0) {
  console.log('数组为空')
}
else {
  console.log('数组不为空')
}

:::

对象

let obj = {
  name: 'L0v3ch4n',
  age: 18,
}

for (let k in obj) {
  // k: 字符串类型，obj中的键
  console.log(k, obj[k])
}

[!note] > 判断对象为空的方法

空对象对应的字符串为 "{}"
for...in遍历
Object.getOwnPropertyNames()
Object.keys()（ES6）
字符串化

// JSON.stringify()
const obj = {}
if (JSON.stringify(obj) == '{}') {
  console.log('对象为空')
}
else {
  console.log('对象不为空')
}

@tab for...in 遍历

// for...in遍历
let isEmpty = false
for (const _ in obj) {
  isEmpty = true
  break
}
if (isEmpty) {
  console.log('对象为空')
}
else {
  console.log('对象不为空')
}

@tab Object.getOwnPropertyNames()

// Object.getOwnPropertyNames()
if (Object.getOwnPropertyNames().length === 0) {
  console.log('对象为空')
}
else {
  console.log('对象不为空')
}

@tab Object.keys()

// Object.keys()
if (Object.keys(arr).length === 0) {
  console.log('对象为空')
}
else {
  console.log('对象不为空')
}

:::

贡献者

Cuber-Wei