「 前端高薪教程」沙老师带你学习JavaScript中的数据类型

冰山工作室出品

什么是数据类型

计算机的本质是计算

计算的本质是对值进行操作

参与计算的值和计算的结果统称为数据

把数据分门别类的归纳出来就是数据类型

JS中的数据类型

6+1种

基本数据类型：

数字（Number）

真假（Boolean）

字符串（String）

空（Null undefined）

ES6新增数据类型（Symbol）

复杂数据类型：对象（Object）

什么是对象●

除基本数据类型之外的数据都是对象，由属性组成的无序的数据集合

EXP:

美女 = {

姓名：xxx（字符串）

年龄：30（数字）

是否知名：是（布尔）

生日：undefined（空）

三围:{

胸围：111

腰围：111 （对象）

臀围：111

}

}

表现区别

1.对象对应的变量保存的是内存地址的引用，基本数据类型对应的变量保存的是值

2.对象是可以改变的，基本数据类型是不可改变的

3.对象可以使用属性和方法，基本数据类型不可以使用属性和方法本质区别

基础数据类型占用固定的内存，保存在栈中，对象占用不固定的内存保存在堆中

数据类型的检测●

使用typeof

typeof和+ - 一样，是运算符，可以使用括号也可以不使用括号

EXP:

var a=true,b=true;

console.log(typeof a==b) //false

typeof的返回值

1.返回值是字符串类型

2.包括number string boolean undefined object function

3.多了function 少了null

4.typeof null返回值是object（本质原因：typeof是将数据转换成二进制进行判断，如果转换后的结果是000开头那么他就是对象，但是null转换成二进制后的结果是0000）

JS的动态性

JS是动态语言，只有当值参与计算的时候才去判断值的类型类似的还包括python、ruby JAVA、C++属于静态语言，在赋值的时候就确定了数据类型

undefined和null的区别

在ES3之前是没有undefined这个值的，ES3标准中新添加的

相同点

1.都只有一个值——空

2.参与判断的时候都返回false

3.都不可以访问属性和调用方法

不同点

1.null是关键字，undefined不是关键字

2.unll是对象但是值为空，undefined的本质是全局对象的属性，这个属性的值叫做“未定义”

3.null是已经初始化的，undefined是未初始化的

4.使用typeof 返回的结果一个是object 一个是undefined

如何使用

1.声明一个变量并且一定需要赋值的时候使用null

2.检测某个值是否存在的时候使用===undefined（全等）

3.检测某个值是否为空的时候使用===null（全等）

4.判断某个值是否存在或者为空的时候使用==null（相等)

空赋值的应用

1.在函数的开头使用var undefined来提升查找速度

2.在声明一个指向对象的变量或者属性的时候使用var xxxx=null或者xxx:null

点击了解更多下载文档《JS中的数据类型》

提取码smke

JavaScript 教程之数据类型-函数

既然f2可以读取f1的局部变量，那么只要把f2作为返回值，我们不就可以在f1外部读取它的内部变量了吗！

functionf1(){

varn=999;

functionf2(){

console.log(n);

}returnf2;

}varresult=f1();

result();//999

上面代码中，函数f1的返回值就是函数f2，由于f2可以读取f1的内部变量，所以就可以在外部获得f1的内部变量了。

闭包就是函数f2，即能够读取其他函数内部变量的函数。由于在JavaScript语言中，只有函数内部的子函数才能读取内部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。闭包最大的特点，就是它可以“记住”诞生的环境，比如f2记住了它诞生的环境f1，所以从f2可以得到f1的内部变量。在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。

闭包的最大用处有两个，一个是可以读取函数内部的变量，另一个就是让这些变量始终保持在内存中，即闭包可以使得它诞生环境一直存在。请看下面的例子，闭包使得内部变量记住上一次调用时的运算结果。

functioncreateIncrementor(start){

returnfunction(){

returnstart++;

};

}varinc=createIncrementor(5);

inc()//5inc()//6inc()//7

上面代码中，start是函数createIncrementor的内部变量。通过闭包，start的状态被保留了，每一次调用都是在上一次调用的基础上进行计算。从中可以看到，闭包inc使得函数createIncrementor的内部环境，一直存在。所以，闭包可以看作是函数内部作用域的一个接口。

为什么会这样呢？原因就在于inc始终在内存中，而inc的存在依赖于createIncrementor，因此也始终在内存中，不会在调用结束后，被垃圾回收机制回收。

闭包的另一个用处，是封装对象的私有属性和私有方法。

functionPerson(name){

var_age;functionsetAge(n){

_age=n;

}functiongetAge(){return_age;

}return{name:name,

getAge:getAge,setAge:setAge

};

}varp1=Person(\'张三\');

p1.setAge(25);

p1.getAge()//25

上面代码中，函数Person的内部变量_age，通过闭包getAge和setAge，变成了返回对象p1的私有变量。

注意，外层函数每次运行，都会生成一个新的闭包，而这个闭包又会保留外层函数的内部变量，所以内存消耗很大。因此不能滥用闭包，否则会造成网页的性能问题。

5.2、立即调用的函数表达式（IIFE）

在Javascript中，圆括号()是一种运算符，跟在函数名之后，表示调用该函数。比如，print()就表示调用print函数。

有时，我们需要在定义函数之后，立即调用该函数。这时，你不能在函数的定义之后加上圆括号，这会产生语法错误。

function(){

/*code*/

}();

//SyntaxError:Unexpectedtoken(

产生这个错误的原因是，function这个关键字即可以当作语句，也可以当作表达式。

//语句

functionf(){}

//表达式

varf=functionf(){}

为了避免解析上的歧义，JavaScript引擎规定，如果function关键字出现在行首，一律解释成语句。因此，JavaScript引擎看到行首是function关键字之后，认为这一段都是函数的定义，不应该以圆括号结尾，所以就报错了。

解决方法就是不要让function出现在行首，让引擎将其理解成一个表达式。最简单的处理，就是将其放在一个圆括号里面。

(function(){

/*code*/

}());

//或者

(function(){

/*code*/

})();

上面两种写法都是以圆括号开头，引擎就会认为后面跟的是一个表示式，而不是函数定义语句，所以就避免了错误。这就叫做“立即调用的函数表达式”（Immediately-InvokedFunctionExpression），简称IIFE。

注意，上面两种写法最后的分号都是必须的。如果省略分号，遇到连着两个IIFE，可能就会报错。

//报错(function(){/*code*/}())

(function(){/*code*/}())

上面代码的两行之间没有分号，JavaScript会将它们连在一起解释，将第二行解释为第一行的参数。

推而广之，任何让解释器以表达式来处理函数定义的方法，都能产生同样的效果，比如下面三种写法。

vari=function(){return10;

}();

true&&function(){

/*code*/

}();0,function(){

/*code*/

}();

甚至像下面这样写，也是可以的。

!function(){/*code*/}();

~function(){/*code*/}();

-function(){/*code*/}();

+function(){/*code*/}();

通常情况下，只对匿名函数使用这种“立即执行的函数表达式”。它的目的有两个：一是不必为函数命名，避免了污染全局变量；二是IIFE内部形成了一个单独的作用域，可以封装一些外部无法读取的私有变量。

//写法一vartmp=newData;

processData(tmp);

storeData(tmp);

//写法二

(function(){vartmp=newData;

processData(tmp);

storeData(tmp);

}());

上面代码中，写法二比写法一更好，因为完全避免了污染全局变量。

6、eval命令

6.1、基本用法

eval命令接受一个字符串作为参数，并将这个字符串当作语句执行。

eval(\'vara=1;\');

a//1

上面代码将字符串当作语句运行，生成了变量a。

如果参数字符串无法当作语句运行，那么就会报错。

eval(\'3x\')

//UncaughtSyntaxError:Invalidorunexpectedtoken

放在eval中的字符串，应该有独自存在的意义，不能用来与eval以外的命令配合使用。举例来说，下面的代码将会报错。

eval(\'return;\');

//UncaughtSyntaxError:Illegalreturnstatement

上面代码会报错，因为return不能单独使用，必须在函数中使用。

如果eval的参数不是字符串，那么会原样返回。

eval(123)//123

eval没有自己的作用域，都在当前作用域内执行，因此可能会修改当前作用域的变量的值，造成安全问题。

vara=1;eval(\'a=2\');

a//2

上面代码中，eval命令修改了外部变量a的值。由于这个原因，eval有安全风险。

为了防止这种风险，JavaScript规定，如果使用严格模式，eval内部声明的变量，不会影响到外部作用域。

(functionf(){

\'usestrict\';

eval(\'varfoo=123\');

console.log(foo);

//ReferenceError:fooisnotdefined

})()

上面代码中，函数f内部是严格模式，这时eval内部声明的foo变量，就不会影响到外部。

不过，即使在严格模式下，eval依然可以读写当前作用域的变量。

(functionf(){

\'usestrict\';varfoo=1;eval(\'foo=2\');

console.log(foo);

//2

})()

上面代码中，严格模式下，eval内部还是改写了外部变量，可见安全风险依然存在。

总之，eval的本质是在当前作用域之中，注入代码。由于安全风险和不利于JavaScript引擎优化执行速度，所以一般不推荐使用。通常情况下，eval最常见的场合是解析JSON数据的字符串，不过正确的做法应该是使用原生的JSON.parse方法。

6.2、eval的别名调用

前面说过eval不利于引擎优化执行速度。更麻烦的是，还有下面这种情况，引擎在静态代码分析的阶段，根本无法分辨执行的是eval。

varm=eval;

m(\'varx=1\');

x//1

上面代码中，变量m是eval的别名。静态代码分析阶段，引擎分辨不出m(\'varx=1\')执行的是eval命令。

为了保证eval的别名不影响代码优化，JavaScript的标准规定，凡是使用别名执行eval，eval内部一律是全局作用域。

vara=1;functionf(){vara=2;vare=eval;

e(\'console.log(a)\');

}

f()//1

上面代码中，eval是别名调用，所以即使它是在函数中，它的作用域还是全局作用域，因此输出的a为全局变量。这样的话，引擎就能确认e()不会对当前的函数作用域产生影响，优化的时候就可以把这一行排除掉。

eval的别名调用的形式五花八门，只要不是直接调用，都属于别名调用，因为引擎只能分辨eval()这一种形式是直接调用。

eval.call(null,\'...\')window.eval(\'...\')

(1,eval)(\'...\')

(eval,eval)(\'...\')

上面这些形式都是eval的别名调用，作用域都是全局作用域。