6.22局部变量及作用域/闭包

函数的含义：程序的基本单元，是完成特定任务的代码语句块

函数分类

系统函数（如parseInt()）

自定义函数（如fn()）

常用系统函数

parseInt ("字符串")

将字符串转换为整型数字

如: parseInt ("86")将字符串“86“转换为整型值86

parseFloat("字符串")

将字符串转换为浮点型数字

如: parseFloat("34.45")将字符串“34.45“转换为浮点值34.45

注：parseFloat 对待整数和parseInt功能一样，对待浮点数会把小数位保留, 而parseInt针对浮点数不会保留小数点

isNaN()

用于检查其参数是否是非数字

var str = "abc";

        console.log(isNaN(str));  /* 不是一个数字返回 true */

        var s = parseFloat(str);

        console.log(s); /* ===>NaN not a number */

用函数的返回值：return

 

函数通过return将值返回调用它的地方

使用 return 时，函数会停止执行，并返回指定的值

如果只有return没有返回值，则直接终止函数的执行。

局部变量VS全局变量

全局变量：在函数外声明的变量，网页上的所有脚本和函数都能访问它

局部变量：在函数内部声明的变量（必须使用var、let、const定义），只能在函数内部访问它

具有可以在不同的函数中使用名称相同的局部变量

生存期

局部变量在函数运行以后被删除

全局变量在页面关闭后被删除

JavaScript作用域

作用域就是变量与函数的可访问范围，即作用域控制着变量与函数的可见性和生命周期

变量的作用域有两种

全局作用域

局部作用域

 

全局作用域

最外层函数和在最外层函数外面定义的变量拥有全局作用域

所有末定义直接赋值的变量自动声明为拥有全局作用域

所有window对象的属性拥有全局作用域

window对象的内置属性都拥有全局作用域，例如

window.alert、window.promt 、window.name、window.location、window.top等等

局部作用域

和全局作用域相反，局部作用域一般只在固定的代码片段内可访问到

作用域链

可以通过代码访问的属性和一系列仅供JavaScript引擎访问的内部属性该内部属性包含了函数被创建的作用域中对象的集合，这个集合被称为函数的作用域链

遵循就近原则，会一层一层的向上寻找，取得最近的一个变量，就不会继续往上寻找了

小结

局部变量VS全局变量

声明位置不同：函数内/函数外

作用域不同：局部/全局

生命期不同：函数执行结束/关闭页面

使用return返回函数值

闭包

var num=1;

function f1(){
alert(num);

}

f1();  //可以显示

原因：函数内部可以直接读取全局变量

 function f1(){
var num=1;

}

alert(num);//无法显示

原因：在函数外部无法读取函数内的局部变量

如何在外部读取局部变量

在函数的内部，再定义一个函数

函数2被包括在1内部，1内部的所有局部变量，对2都是可见的

JS特有的"链式作用域"结构（父对象的所有变量，对子对象都是可见的，反之则不成立）

把内部函数作为返回值

简单的闭包：一个单个的函数就是一个闭包；

复杂的闭包

代码中的内部函数就是闭包

闭包就是能够读取其他函数内部变量的函数

可以把闭包简单理解成"定义在一个函数内部的函数"

是将函数内部和函数外部连接起来的一座桥梁

原理：函数中的变量被内部的函数所引用，导致变量在内存中销毁不掉，所以函数外部可以通过闭包的方式访问函数内部的变量。

闭包的用途

外部可以读取函数内部的变量

让这些变量的值始终保持在内存中

闭包的缺点

※ 闭包会使得函数中的变量都被保存在内存中，内存消耗很大，所以不能滥用闭包，否则会造成网页的性能问题，在IE中可能导致内存泄露

※ 闭包会在父函数外部，改变父函数内部变量的值

练习：

使用闭包的方式实现计数器，要求如下：

打开页面，就弹出2，点击确定后，再弹4，再点击确定后，弹出6就停止，不再弹出数字了

闭包简单理解为定义在一个函数内部的函数

闭包的用途

可以读取函数内部的变量

让这些变量的值始终保持在内存中

闭包的缺点

※ 内存消耗

※ 会在父函数外部，改变父函数内部变量的值

变量提升

浏览器在预加载的时候看到var关键字，会给变量先赋值为undefined

使用var 这种方式赋值函数给一个变量，不能先使用，再定义，因为变量会变量提升，为undefined;

※ 没有名字的函数叫做匿名函数

let、const 是没有变量提升这一功能，

栈内存和堆内存

定义了一个对象的时候，相当于在内存中开辟了一个内存

内存里面包含栈内存和堆内存，堆内存存储的是实际值/存储数据，栈内存存储的是内存地址

JavaScript操作BOM&DOM
JavaScript组成

ECMAScript    BOM     DOM

什么是ECMAScript

ECMAScript是一种语法标准

语法、变量和数据类型、运算符、逻辑控制语句、关键字、保留字、对象

编码遵循ECMAScript标准

什么是BOM

BOM：Browser Object Model（浏览器对象模型）

提供了独立于内容与浏览器窗口进行交互的对象

浏览器对象模型

对象名称 说明

window 窗口对象, 可以用来控制当前窗口, 或打开新的窗口

screen 屏幕对象, 获取屏幕相关信息

navigator 浏览器对象, 通过这个对象可以判定用户所使用的浏览器

history 历史对象, 可以用来前进或后退一个页面

location 地址对象, 可以用来获取当前URL的信息

JavaScript 计时事件 在一个设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行

localStorage

SessionStorage 存储对象, 可以用来存储数据, 和cookie相似, 区别是它是为了更大容量存储设计的, 在使用上也更加方便

JavaScript 弹窗

弹窗 语法 说明

 警告框 window.alert() 用于确保用户可以得到某些信息

确认框 window.confirm() 用于验证是否接受用户操作

提示框 window.prompt() 用于提示用户在进入页面前输入某个值

confirm()方法

confirm("对话框中显示的纯文本")

var r=confirm("按下按钮!");

if (r==true/r){
x="你按下了【确定】按钮!";

}else{
x="你按下了【取消】按钮!";

}

0和””以及null会隐式数据类型转换为false

带空格的字符串和字符串0 会隐式数据类型转换为true