js基础

Object 对象
-- object {key:value,key1:value1}
-- array 数组 [元素1,元素2]
--Function 函数 function 函数名(){函数体}
--RegExp 正则（校验某个字符串是否满足我的规则） /^1[3-9][0-9]{9}/
--Date 日期类型（格林威治日期格式）Tue Feb 18 2025 10:49:22 GMT+0800 (中国标准时间)

引用数据类型2.0

实例化定义 new Object() new Array() new Funtion() new RegExp() new Date()
字面量定义 {} [] function(){} /规则/ new Date()

5.类型转换

在 JavaScript 中数据被分成了不同的类型，如数值、字符串、布尔值、undefined，在实际编程的过程中，不同数据类型之间存在着转换的关系。

5.1隐式转换

某些运算符被执行时，系统内部自动将数据类型进行转换，这种转换称为隐式转换。

5.2显式转换

编写程序时过度依靠系统内部的隐式转换是不严禁的，因为隐式转换规律并不清晰，大多是靠经验总结的规律。为了避免因隐式转换带来的问题，通常根逻辑需要对数据进行显示转换。

6.常见运算符

①　算术运算符： + - * / % ++ -- ②　比较运算符：== != > >= < <= =(全等于) !(不全等于) ③　条件运算符：(expr1) ? (expr2) : (expr3) ④　逻辑运算符：&&（与一假则假） ||（或一真则真） ! (非真变假，假变真)

逻辑运算符优先级：！> && > ||

⑤　字符串运算符：+ ⑥　赋值运算符： = += -= *= /= %=

7.语句

7.1分支语句

分支语句包含：

if分支语句（重点）

if(条件表达式) {
  // 满足条件要执行的语句
}else if(条件表达式){
    // 满足条件要执行的语句
}else{
     // 满足条件要执行的语句
}

三元运算符
使用场景：一些简单的双分支，可以使用三元运算符（三元表达式)
符号：? 与 : 配合使用
语法：
```
条件 ? 表达式1 ： 表达式2
```

switch语句

  switch (2) {
    case 1:
    console.log('您选择的是1')
    break  // 退出switch
    case 2:
    console.log('您选择的是2')
    break  // 退出switch
    case 3:
    console.log('您选择的是3')
    break  // 退出switch
    default:
    console.log('没有符合条件的')
  }

7.2循环语句

1.while循环三要素：1.初始值（经常用变量）；终止条件；变量的变化量

// while循环: 重复执行代码

// 1. 需求: 利用循环重复打印3次 '月薪过万不是梦，毕业时候见英雄'
let i = 1
while (i <= 3) {
  document.write('月薪过万不是梦，毕业时候见英雄~<br>')
  i++   // 这里千万不要忘了变量自增否则造成死循环
}

2.for 循环（重点）

for(起始值; 终止条件; 变化量) {
    要重复执行的代码
  }

7.2.1中止循环

break 中止整个循环，一般用于结果已经得到, 后续的循环不需要的时候可以使用（提高效率）

continue 中止本次循环，一般用于排除或者跳过某一个选项的时候

7.2.2无限循环

1.while(true) 来构造“无限”循环，需要使用break退出循环。（常用）

2.for(;😉 也可以来构造“无限”循环，同样需要使用break退出循环。

二.数组(重点)

数组：(Array)是一种可以按顺序保存数据的数据类型

1数组的基本使用

1.1定义数组和数组单元

<script>
  // 1. 语法，使用 [] 来定义一个空数组
  // 定义一个空数组，然后赋值给变量 classes
  // let classes = [];
  // 2. 定义非空数组
  let classes = ['小明', '小刚', '小红', '小丽', '小米']
	//3.通过Array来创建数组
let arr = new Array(1,5,56,59,9,59,2,26) 
////二维数组
let arr2 = [[123,456],[789,1]]   
//数组对象
let arr3 = [{name:'123'},{name:'123'}]  
</script>

1.2数组的使用

通过数组[下标]来进行使用 下标从0开始计数

数组属性 获取数组的长度 arr.length

1.3操作数组方法(重点)

push 动态向数组的尾部添加一个单元
unshit 动态向数组头部添加一个单元
pop 删除最后一个单元
shift 删除第一个单元
splice 动态删除任意单元

使用以上方法都是直接在原数组上进行操作，即成功调任何一个方法，原数组都跟着发生相应的改变。并且在添加或删除单元时 length 并不会发生错乱。

script>
  // 定义一个数组
  let arr = ['html', 'css', 'javascript']
  // 1. push 动态向数组的尾部添加一个单元
  arr.push('Nodejs')
  arr.push('Vue')
  // 2. unshit 动态向数组头部添加一个单元
  arr.unshift('VS Code')
  // 3. splice 动态删除任意单元
  arr.splice(2, 1) // 从索引值为2的位置开始删除1个单元
  // 4. pop 删除最后一个单元
  arr.pop()
  // 5. shift 删除第一个单元
  arr.shift()
</script>

三.函数(重点)

理解函数的封装的特征
掌握函数声明的语法
理解什么是函数的返回值
知道并能使用常见的内置函数

1.声明和调用

函数可以把具有相同或相似逻辑的代码封装起来，通过函数调用执行这些被封装的代码逻辑，精简代码方便复用

1.1声明一个完整函数包括关键字、函数名、形式参数、函数体、返回值5个部分

1.2声明的函数必须调用才会真正被执行，使用 () 调用函数。

//函数的定义
function hello(name){
    let result='hello'+name
    return result
}

//函数的调用
hello(name)

2. 参数：形参和实参

2.1参数：通过向函数传递参数，可以让函数更加灵活多变，参数可以理解成是一个变量。

2.2参数分为形参和实参

形参：声明函数时写在函数名右边小括号里的叫形参（形式上的参数）

实参：调用函数时写在函数名右边小括号里的叫实参（实际上的参数）

形参与实参个数尽量保持一致

3.返回值

函数的本质是封装，函数体内的逻辑执行完毕后，要想获得函数内部逻辑的执行结果，需要通过 return 这个关键字，将内部执行结果传递到函数外部，这个被传递到外部的结果就是返回值。

    // 定义求和函数
    function count(a, b) {
      let s = a + b
      // s 即为 a + b 的结果
      // 通过 return 将 s 传递到外部
      return s
    }

    // 调用函数，如果一个函数有返回值
    // 那么可将这个返回值赋值给外部的任意变量
    let total = count(5, 12)

注意：

在函数体中使用return 关键字能将内部的执行结果交给函数外部使用
函数内部只能出现1 次 return，并且 return 下一行代码不会再被执行，所以return 后面的数据不要换行写
return会立即结束当前函数
函数可以没有return，这种情况默认返回值为 undefined

4.匿名函数

函数可以分为具名函数和匿名函数

匿名函数通常用于 函数表达式 中，即将一个函数赋值给变量。

const /let /var hi=function(){
     let result='hi'
    return result
}
hi()

5.立即执行函数

(function(){ xxx  })();
(function(){xxxx}());

无需调用，立即执行，其实本质已经调用了
多个立即执行函数之间用分号隔开

四.作用域(重点)

变量访问规则：在能够访问到的情况下先局部局部没有在找全局

一段程序代码中所用到的名字并不总是有效和可用的，而限定这个名字的可用性的代码范围就是这个名字的作用域。

作用域的使用提高了程序逻辑的局部性，增强了程序的可靠性，减少了名字冲突。

1.全局作用域

作用于所有代码执行的环境(整个 script 标签内部)或者一个独立的 js 文件

处于全局作用域内的变量，称为全局变量

通俗一点:谁都可以使用的就是全局变量

<script>
    const a=12;
	let b=2;
</scrip>

2.局部作用域

作用于函数内的代码环境，就是局部作用域。因为跟函数有关系，所以也称为函数作用域。

处于局部作用域内的变量称为局部变量

如果函数内部，变量没有声明，直接赋值，也当全局变量看，但是强烈不推荐
但是有一种情况，函数内部的形参可以看做是局部变量

通俗一点: 在特定区域可以使用的在外面不可以使用的变量

const /let /var hi=function(){
     let result='hi'
    return result
}

五.数学内置方法

toFixed(3) 保留小数位数四舍五入

3.55666.toFixed(3)    //3.557

parseInt(‘3.55’) 转换为数字并保留整数截取整数部分 3
parseFloat(‘3.55’) 转换为数字并保留整数+小数 3.55
Number('3.55') 转换为数字 3.55

六.数学方法 Math

Math.random，生成 0 到 1 间的随机数

// 0 ~ 1 之间的随机数, 包含 0 不包含 1
Math.random()

Math.ceil，数字向上取整

// 舍弃小数部分，整数部分加1
Math.ceil(3.4)

Math.floor，数字向下取整

// 舍弃小数部分，整数部分不变
Math.floor(4.68)

Math.round，四舍五入取整

// 取整，四舍五入原则
Math.round(5.46539)
Math.round(4.849)

Math.max，在一组数中找出最大的

// 找出最大值
Math.max(10, 21, 7, 24, 13)

Math.min，在一组数中找出最小的

// 找出最小值
Math.min(24, 18, 6, 19, 21)

Math.pow，幂方法

// 求某个数的多少次方
Math.pow(4, 2) // 求 4 的 2 次方
Math.pow(2, 3) // 求 2 的 3 次方

Math.sqrt，平方根

// 求某数的平方根
Math.sqrt(16)

七.对象

对象数据类型可以被理解成是一种数据集合。它由属性和方法两部分构成。

1.语法

关键字变量名={}

    // 声明对象类型变量，使用一对花括号
    // user 便是一个对象了，目前它是一个空对象
    let user = {}
    let user1={
        name:'name'//注意对象键值对之间采用冒号 而不是等号
        age:'123
    }

2.属性和访问

数据描述性的信息称为属性，如人的姓名、身高、年龄、性别等，一般是名词性的。

属性都是成对出现的，包括属性名和值，它们之间使用英文 : 分隔
多个属性之间使用英文 , 分隔
属性就是依附在对象上的变量

属性名可以使用 "" 或 ''，一般情况下省略，除非名称遇到特殊符号如空格、中横线等

获取对象的属性名和属性值使用 . 或 [] 获得对象中属性对应的值进行属性访问


    // 通过对象描述一个人的数据信息
    // person 是一个对象，它包含了一个属性 name
    // 属性都是成对出现的，属性名 和 值，它们之间使用英文 : 分隔
    let person = {
      name: '小明',
      age: 18, 
      stature: 185, 
      gender: '男', 
    }
    
	//属性访问
    // 访问人的名字
    console.log(person.name) // 结果为 小明
    // 访问人性别
    console.log(person.gender) // 结果为 男
    // 访问人的身高
    console.log(person['stature']) // 结果为 185
   // 或者
    console.log(person.stature) // 结果同为 185

3.方法和调用

方法是由方法名和函数两部分构成，它们之间使用 : 分隔
多个属性之间使用英文 , 分隔
方法是依附在对象中的函数
方法名可以使用 "" 或 ''，一般情况下省略，除非名称遇到特殊符号如空格、中横线等

方法的调用与属性访问的方法相同都是使用. 或 [] 进行调用

<script>
    // 方法是依附在对象上的函数
    let person = {
      name: '小红',
      age: 18,
      // 方法是由方法名和函数两部分构成，它们之间使用 : 分隔
      singing: function () {
        console.log('两只老虎，两只老虎，跑的快，跑的快...')
      },
      run: function () {
        console.log('我跑的非常快...')
      }
    }
//属性调用
 console.log(person.name)
 console.log(person.age)

//方法调用
console.log(person.run())
  </script>

4.动态为对象添加属性

直接通过对象.或者[]进行动态添加

  <script>
    // 声明一个空的对象（没有任何属性）
	let user = {}
    // 动态追加属性
    user.name = '小明'
    user['age'] = 18
    
    // 动态添加方法
    user.move = function () {
      console.log('移动一点距离...')
    }
  </script>

5.null

null 也是 JavaScript 中数据类型的一种，通常只用它来表示不存在的对象。使用 typeof 检测类型它的类型时，结果为 object。

6.遍历对象

let obj = {
    uname: 'pink'
}
for(let k in obj) {
    // k 属性名  字符串  带引号    obj.'uname'     k ===  'uname'
    // obj[k]  属性值    obj['uname']   obj[k]
}

for in 不提倡遍历数组因为 k 是字符串