ThinkChat🤖让你学习和工作更高效,注册即送10W Token,即刻开启你的AI之旅 广告
[TOC] ## 变量类型 1. 值类型 ``` var a= 100 var b= a a=200 console.log(b) //100 b 的值不受 a 值影响 ``` 2. 引用类型 引用类型:对象、数组、函数 ``` var a={ age: 20} var b= a b.age= 21 console.log(a.age) //21 a 值受到 b 值的影响 ``` ## typeof运算符详解 ``` typeof undefined // undefined typeof abc // string typeof 123 // number typeof true // boolean typeof t // object typeof [] // object typeof null // object typeof console.log // function ``` `typeof`只能区分值类型 如 `string ,number,boolean, ` 不能区分引用类型 ## 变量计算 - 强制类型转换 1. 字符串拼接 ```js var a=100+10 // 110 var b=100 + '10' // '10010' ``` 3. ==运算符 ``` 100=="100" //true 0 == '' // true null == undefined // true ``` 5. if语句 ``` var b= 100 if(b){} ``` 7. 逻辑运算 ``` console. log (10 && 0) //0 console. log('' || 'abc) //'abc' console. log( !!window.abc) //true ``` ### 何时使用===和== 除了下面这种其他都是用 `===` 形式写 ``` if (obj.a= null){ //这里相当于obj.a===nulL|lobj.a=== undefined,简写形式 //这是 Jquery源码中推荐的写法 } ``` ## JS中的内置函数 Object Array Boolean Number String Function Date Regexp Error ## 如何理解JSON 只是一个 js 对象 ``` JSON.stringify ({a: 10, b: 201}) //js 对象转json J0SN. parse('{"a":10,"b":20}') //json 转 js 对象 ``` ## 作用域 ### 全局 ```js //相当于把 变量a 的声明提前 并且赋值为 undefined var a = undefined console. log (a) //undefined var a =100 //把函数提前 fn('zhangsan') //zhangsan function fn (name){ console. log(name) } ``` ### this this要在执行时才能确认值,定义时无法确认 1. 作为构造函数执行 ``` function Foo(name){ this.name=name console.log(this); //this 为构造函数 } var f = new Foo('zhangsan'); ``` 3. 作为对象属性执行 ``` var obj = { name:'A', printName:function(){ console.log(this.name) //this 为对象本身 } } obj.printName(); ``` 5. 作为普通函数执行 ``` function fn(){ console.log(this) //this 为 window } fn(); ``` 7. call apply bind ``` function fn1(name){ alert(name); console.log(this) } fn.call({x:100},'zhangsan'); //第一个传入的就是 this 的值 fn.apply({x:100},['zhangsan']); //apply 参数以数组形式传入 var fn2 = function (name){ alert(name); console.log(this) // this 为{ y:200} }.bind({y:200}); fn2('zhangsan') ``` ### 作用域 - 没有块级作用域 ``` if (true) { var name ='zhangsan' } console.log(name) //zhangsan ``` - 只有函数和全局作用域 ``` var a=100 function fn(){ var a =200 console.log(a) // 200 } console.log(a) //100 fn() ``` ### 闭包 ``` function F1(){ var a = 100 return function(){ console.log(a) } } var f1 = F1() var a =200 f1() //100 ``` #### 真题 创建10 个 a 标签,点击弹出对应的顺序标记 ``` var i //作用域与闭包考点 for ( i = 0; i<10; i++) { (function(i){ var a = document.createElement('a') a.innerHTML=i+'<br/>' a.addEventListener('click',function(e){ e.preventDefault() alert(i) }) document.body.appendChild(a) })(i) } ``` ## 日期 ``` Date,now()//获取当前时间毫秒数 var dt= new Date() dt.gettime() //获取毫秒数 dt.getfullyear() //年 dt.getmonth() // 月(0-11) dt.getdate() // 日 0-31) dt.gethours() //小时(0-23) dt.getminutes() //分钟(0-59) dt.getseconds() // 秒 (0-59 ``` ## Math Api ``` Math.random() //0.10596426644876211 ``` ## 数组 APi - foreach 遍历所有元素 ``` var arr =[1,2,3,] arr.age=12 //age 会加入遍历,但是无法为 undefined arr.forEach(function (item,index){ console.log(index,item) }) 0 1 1 2 2 3 undefined ``` - every 判断所有元素是否都符合条件 ``` var arr =[1,2,3,4,5] //只有所有元素都满足要求才会返回 true var result = arr.every(function(item,index){ if(item<4){ return true } }) console.log(result) //false 因为数组不满足要求 ``` - some 判断是否有至少一个元素符合条件 ``` var arr =[1,2,3,4,5] // 只要有满足条件的就返回 true var result = arr.some(function(item,index){ if(item<4){ return true } }) console.log(result) //true ``` - sort 排序 ``` var arr =[1,3,2,4,5] var result = arr.sort(function(a,b){ //从小到大排序 return a-b // return b-a 从大到小 }) console.log(result) //1,2,3,4,5 ``` - map 对元素重新组装,生成新数组 ```js var arr =[1,2,3,4,5] var result = arr.map(function(item,index){ return '<b>'+item+'<b/>' }) console.log(result) //["<b>1<b/>", "<b>2<b/>", "<b>3<b/>", "<b>4<b/>", "<b>5<b/>"] ``` - filter 过滤符合条件的元素 ``` var arr =[1,2,3,4,5] //返回所有值大于等于2 var result = arr.filter(function(item,index){ if (item>=2) return true }) console.log(result) //[2, 3, 4, 5] ``` ## 对象 APi - for in ```js var obj = { x:100, y:200, z:200 } var key for (key in obj){ //虽然高级浏览器可以过滤原型中的属性,但是加入此判断可以提高代码健壮度 if(obj.hasOwnProperty(key)){ console.log(key,obj[key]) } } //输出 x 100 y 200 z 300 ```