JavaScript 基础

<!-- 方式 1：script 标签内直接书写 -->
<script>
  console.log('hello')
</script>

<!-- 方式 2：引入外部 js 文件 -->
<script src="app.js"></script>

// 单行注释

/*
  多行注释
  多行注释
*/

// ES5：var 声明
var name = 'jason'

// ES6：let 声明（推荐）
let name = 'jason'

// 常量：const（ES6），声明后不可重新赋值
const PI = 3.14

var a = 11;
var b = 11.11;
typeof a   // "number"
typeof b   // "number"

parseInt("123")    // 123
parseInt("ABC")    // NaN
parseFloat("3.14") // 3.14

var a = "Hello";
var b = 'world';
var c = a + b;        // "Helloworld"（JS 中用 + 拼接字符串）

// 模板字符串（ES6，反引号）：支持多行和变量插值
var name = 'jason';
var age = 18;
var s = `my name is ${name} and my age is ${age}`;

var s = '$$jason$$';
s.charAt(0)        // "$"
s.indexOf('as')    // 3
s.slice(0, -1)     // "$$jason$"
s.split('$')       // ["", "", "jason", "", ""]

// JS 布尔值全小写（Python 是首字母大写）
true
false

var l = [111, 222, 333, 444, 555, 666];
l[0]       // 111
l[-1]      // undefined（不支持负数）
typeof l   // "object"

var l = [111, 222, 333, 444, 555, 666];

l.push(777)           // [111, ..., 777]
l.pop()               // 777，l 恢复为 6 个
l.join('$')           // "111$222$333$444$555$666"
l.reverse()           // [666, 555, 444, 333, 222, 111]

// forEach 遍历
l.forEach(function(value, index) {
  console.log(value, index)
})

// splice：删除前 3 个元素
l.splice(0, 3)        // 返回 [666, 555, 444]

// map：每个元素乘 2
[1, 2, 3].map(function(value) { return value * 2 })  // [2, 4, 6]

typeof "abc"   // "string"
typeof 123     // "number"
typeof true    // "boolean"
typeof null    // "object"（历史遗留问题）
typeof []      // "object"
typeof {}      // "object"
typeof undefined // "undefined"

// 方式 1：字面量
var d = { name: 'jason', age: 18 };
d['name']   // "jason"
d.name      // "jason"（JS 特有的点语法）

// 遍历（for...in 暴露的是键）
for (let key in d) {
  console.log(key, d[key])
}

// 方式 2：new Object()
var d2 = new Object();
d2.name = 'jason';
d2['age'] = 18;

let d = new Date();
d.toLocaleString()   // "2026/6/26 下午2:30:00"

// 手动指定时间（月份从 0 开始）
let d2 = new Date('2200/11/11 11:11:11');
let d3 = new Date(2026, 5, 26, 14, 30, 0);  // 第 6 个月（索引 5）

// 常用方法
d.getFullYear()      // 年
d.getMonth()         // 月（0-11）
d.getDate()          // 日
d.getDay()           // 星期（0=周日）
d.getHours()         // 时
d.getMinutes()       // 分
d.getSeconds()       // 秒
d.getTime()          // 时间戳（毫秒）

let obj = { name: 'jason', age: 18 };

// 序列化
let s = JSON.stringify(obj);   // '{"name":"jason","age":18}'

// 反序列化
JSON.parse(s);                 // { name: 'jason', age: 18 }

// 创建正则（推荐字面量写法）
let reg = /^[a-zA-Z][a-zA-Z0-9]{5,11}/;

// 测试匹配
reg.test('egondsb')   // true
reg.test('123abc')    // false

// 全局匹配（g 标志）
let s = 'egondsb dsb dsb';
s.match(/s/)    // 找到第一个就停止
s.match(/s/g)   // ["s", "s", "s"]

// 算术运算符
var x = 10;
var res1 = x++;   // 先赋值后自增，res1 = 10，x = 11
var res2 = ++x;   // 先自增后赋值，res2 = 12，x = 12

// 比较运算符
1 == '1'    // true（弱等于，自动类型转换）
1 === '1'   // false（强等于，不做类型转换，推荐使用 ===）
1 != '1'    // false
1 !== '1'   // true

// 逻辑运算符（对应 Python 的 and/or/not）
5 && '5'    // '5'（返回最后一个真值）
0 || 1      // 1（返回第一个真值）
!5          // false

// 赋值运算符
// = += -= *= /= 等（与 Python 一致）

// if / else if / else
var age = 28;
if (age < 18) {
  console.log('未成年');
} else if (age < 60) {
  console.log('成年');
} else {
  console.log('老年');
}

// switch（提前列举可能的条件）
var num = 2;
switch (num) {
  case 0: console.log('喝酒'); break;
  case 1: console.log('唱歌'); break;
  case 2: console.log('洗脚'); break;
  default: console.log('默认流程');
}

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

// while 循环
var i = 0;
while (i < 100) {
  console.log(i);
  i++;
}

// 三元运算符（Python：1 if 1>2 else 3）
var res = 2 > 5 ? 8 : 10;   // 10

// 有名函数
function func(a, b) {
  console.log(a, b);
}
func(1, 2);        // 1 2
func(1, 2, 3, 4);  // 1 2（多余的参数忽略）
func(1);           // 1 undefined（缺少的参数为 undefined）

// arguments 关键字：获取所有实参
function func(a, b) {
  console.log(arguments.length);  // 实参个数
  console.log(arguments);         // 类数组对象
}

// 返回值（只能返回一个值，多值用数组或对象包装）
function index() {
  return [666, 777, 888];
}

// 匿名函数（赋值给变量）
var greet = function() {
  console.log('hello');
};
greet();

// 箭头函数（ES6，适合简单逻辑）
var double = v => v * 2;
// 等价于：var double = function(v) { return v * 2; }

var add = (a, b) => a + b;

// JS 查找变量的顺序：当前作用域 → 外层 → 全局（与 Python 类似）
var city = 'BeiJing';

function f() {
  var city = 'ShangHai';
  function inner() {
    var city = 'ShenZhen';
    console.log(city);  // ShenZhen
  }
  inner();
}
f();

// 闭包：inner 捕获的是定义时的外层作用域
function f2() {
  var city = 'ShangHai';
  function inner() {
    console.log(city);  // ShangHai（不是全局的 BeiJing）
  }
  return inner;
}
f2()();