js的基础知识笔记
一、基本数据类型
1、使用var
声明变量、使用;
结尾、使用{}
表示代码块、使用驼峰式命名
2、变量是弱类型的,即并不严格要求声明变量的类型,一个变量可以在运行期间动态的指向不同类型的数据
3、变量声明后可以不定义(或叫赋值、初始化),此时它的值是undefined
4、符号$
可以作为命名开头的特殊字母,jQuery
使用它作为jquery
函数的别名
5、数据分为两大类:原始数据和引用数据,所以一个变量中保存的值自然也有两类
原始数据:直接存放在栈中, 变量中保存着此数据的直接值
引用数据:存放在堆中,并把内存地址存放在栈中,即变量中存放着此对象的指针
6、原始类型:undefined
、boolean
、number
、string
、null
7、引用类型:即对象object
,其他array
、function
等对象都是在object
基础上进一步封装的对象
二、函数
1、函数也是一个对象,构造函数在功能上还类似于一个类
2、函数如果没有显式说明返回值,则默认return undefined
3、函数对输入参数的要求并不严格(数量、类型),可以使用arguments
来获得一个函数的输入参数数组
4、函数也是一个对象意味着,函数可以被当做输入参数、也可以被return
,这就意味着可以实现闭包
5、函数的toString()
方法可以得到函数的源代码
6、闭包,保存了函数定义时上下文的执行环境,当函数执行时,可以获取到这些数据
闭包的支持意味着可以完成装饰器模式
7、函数声明和函数表达式在某些环境下有非常大的区别
函数声明:
function show(){}
函数表达式:
var show = function(){}
函数声明有很高的优先级,会被解释器提前解析并释放到执行环境中()
console.log(show) // 可以正常的打印出show函数对象
function show(){}
以上两句语句可以正常执行而不报错,全局代码被扫描的时候通过词法分析会在当前函数的AO对象中设定show变量的值为对应函数
而函数表达式等价于一个赋值语句,只有在运行此句代码时才执行,一下语句会报错
console.log(show)
var show = function(){}
8、词法分析,一个函数在被真正执行内部代码前,解释器会先扫描函数源代码并执行词法分析,目的是提前完成函数作用域的生成,
函数作用域通过一个AO
对象来保存,后续在逐行执行函数代码时,所有的变量查询都通过AO
对象,词法分析步骤:
a、分析函数输入参数,若函数源代码出现输入参数,则发生此步骤。解释器在AO
对象中添加此属性,值为undefined
,若有接收实参,则覆盖原有的值
b、分析变量,若函数源代码中出现变量定义,则发生此步骤。解释器寻找AO
对象中是否有此属性,若无则增加,值为undefined
,若有,什么也不做
c、分析函数声明,若函数源代码中出现函数声明(函数表达式会被定义为步骤b),则发生此步骤。解释器寻找AO
对象是否有此属性,若无则增加,若有,则覆盖
换句话说,如果在一个函数func1
内部有另一个函数声明func2
,此func1
函数在真正被执行内部代码前就已经生成了AO
对象并且func2
函数已经在func1
函数的作用域中
三、面向对象
1、js
对象类似于Python
中的字典,里面存放着无序的键值对
2、对象中的属性(数据属性、函数属性)权限均为公开的(和Python
一样),使用_xxx_
的方式约定俗成的表示成私有数据(Python
中使用__xxx
)
3、this
指代当前对象,尤其在构造函数中使用时,指代当前被初始化的对象(类似Python
的__init__
中的self
)
4、如何定义一个类(实际是构造函数)
a、构造函数定义数据+原型定义函数(我个人比较常用此种方式,代码清晰)
function Stu(stuName, stuAge){
this.stuName = stuName;
this.stuAge = stuAge;
}
Stu.prototype.goToSchool = function(schoolName){
console.log(this.stuName + ' is going to school: ' + schoolName);
}
b、构造函数定义数据+函数(这种模型也可以用于处理单例模式)
function Stu(stuName, stuAge){
this.stuName = stuName;
this.stuAge = stuAge;
if(!Stu.__definedFlag){ //实际上此函数被当做单例模式
Stu.prototype.goToSchool = function(schoolName){
console.log(this.stuName + ' is going to school: ' + schoolName);
}
var Stu.__definedFlag = true;
}
}