初学JavaScript小总结

最新推荐文章于 2024-06-10 22:18:41 发布

是侯不是候.

最新推荐文章于 2024-06-10 22:18:41 发布

阅读量232

点赞数

文章标签： javascript 前端

本文链接：https://blog.csdn.net/m0_52563745/article/details/126284344

版权

JavaScript中数据类型

四基：Number（数值型）、String（字符串型）、Boolean（布尔型）、Symbol（符号型）、NaN（特殊数值类型）
两空：Null、Undfined
一对象：Object

数据类型互相转换

将其他类型转换成Number型：

1、Number（）

console.log(Number('123')) //123

console.log(Number('12.2')) //12.2

console.log(Number(true)) //1

console.log(Number(false))//0

2、paserInt（）

console.log(parseInt(1))//1

console.log(parseInt(null)) // NaN

console.log(parseInt(undefined))//NaN

console.log(parseInt('HELLO'))//NaN

console.log(parseInt('123XXX')) //123 遇到第一个非number数据形式的字符就停止转换！将之前的数值格式的数据转换并返回

console.log(parseInt('123.5XXX')) //123

3、paserFloat()

console.log(parseFloat(1)) //1

console.log(parseFloat('1.2')) //1.2

console.log(parseFloat(null)) //NaN

console.log(parseFloat(undefined)) //NaN

console.log(parseFloat('123.5XXXX')) //123.5

将其他类型转变为String型

1、String（）

console.log(String(123)) //123

console.log(String('xxx')) //xxx

console.log(String(true)) //true

2、toString()

var num = 100

console.log(num.toString()) //100

3、 + （当‘+’号两边有一侧为字符串类型时，此时的‘+’号作为拼接符，）

console.log(1+'a') //1a

其他类型转变为Boolean型

Boolean()

console.log(Boolean(0)) //false

console.log(Boolean('4')) //true

console.log(Boolean(null)) //false

console.log(Boolean(undefined) //false

JS中的运算符

算术运算符
单目运算符
自增自减运算符
比较运算符
逻辑运算符
括号运算符
逗号运算符
条件运算符

流程控制结构：顺序结构、选择结构、循环结构

顺序结构：js代码整体的运行轨迹是从上往下依次执行的
选择结构：单分支-----if语句、双分支------if....else、多分支------if....else 的嵌套、条件分支-----switch.....case
循环结构：for、while、do.....while

JavaScript中的对象类型

在JavaScript中除了基本数据类型外，其他的数据类型都是对象类型，称为复杂数据类型（引用数据类型）。对象可分为{ }（浅称为花括号对象）、[ ]（数组对象）、函数（函数对象）、js的内置对象、浏览器提供的对象（宿主对象）

作用域

var声明的变量以及function声明的函数在声明创建的时候，其作用域就已经确定了！

js中作用域：

全局作用域
函数作用域
块级作用域

预解析

JS的代码并不是一上来就马上开始解释执行，而是在执行前又一个短暂的预解析的过程！预解析中主要做以下事情：

1、构建全局对象

2、寻找当前作用域下所声明的所有的var 声明变量以及 function声明的函数，将他们提前到当前作用域的开始位置

注意：函数和变量都需进行预解析时，函数应优先于变量！函数作用域中也会存在变量和函数的提升，匿名函数或者函数表达式是不进行函数提升的，对象中保存的函数也不会进行提升

this关键字

当函数被调用时，运行环境会自动向该函数隐式传入this对象。this的指向是变化的，在不同情况下函数的执行中，this的指向是不一样的!

当函数作为普通函数调用执行时函数名()或IIFE 函数的this指向的是window

function fun1(){

console.log(this)

}

fun1() //window{...}

;(function(){

console.log(this)

})() //window{...}

当函数作为某个对象的方法进行调用时，该方法中的this指向的是调用者，而非持有者！对象名.方法() 表达式.方法() 对象名[方法名]()

function fun1(){

console.log(this)

}

window.fun1() //window{...}

var obj1 = {

name:'obj1',

fun1:function(){

console.log(this)

}

}

obj1.fun1() //obj1{...}

obj1['fun1']() //obj1{...}

this劫持

正常情况下this的指向规则：

1、在全局作用域下访问this，this是指向window

2、当函数以函数形式调用时，this是指向window

3、当函数以 IIFE形式调用时，this是指向window

4、当函数以方法的形式调用时，this指向的是调用者，而非持有者

5、当作为构造函数调用时，this指向一个空对象 {}

this的劫持：强行的人为改变this的指向！

实现this劫持的三种方式（基于三个方法）：apply call bind

apply 和 call 用法基本一致

唯一不同之处：

apply 接受两个参数 1、对象 2、数组将其余参数统一存放到该数组中

call 接受任意个参数 1、对象其余参数就是正常的函数执行所需要的实参逗号分隔

bind 将函数进行改造后，并重新返回，最终执行！

闭包

闭包就是当函数被嵌套声明时，并且该函数被直接或者间接返回或者赋值给某个全局变量！

那么这个时候js内部发生一些事情

1、函数的地址值被返回了

2、产生了一个特殊的对象，闭包（在这个闭包它打包了该函数作用域链上的所有的变量以及函数）

 //   产生了两个独立的闭包对象，每个闭包对象分别有一个链子
    //   function fun1() {
    //     var a, b
    //     a = 100
    //     b = 200
    //     function xxx() {
    //       console.log('xxx')
    //     }

    //     function fun2() {
    //       console.log(++a)
    //     }
    //     return fun2
    //   }
    //   var myfun1 = fun1()
    //   var myfun2 = fun1()
    //   myfun1()//101
    //   myfun2()//101