1
在JavaScript中的变量分别区分为两种:
一种为基本类型值,一种为应用类型值。
基本类型值指的是简单的数据段
引用类型值为可能由多个值组成的对象
![bfad484cff6d26522135ec7bd6a04018.png](https://i-blog.csdnimg.cn/blog_migrate/74937db849cbe45f71e61281fd5d65bf.jpeg)
引用类型的值是保存在内存中的对象,JavaScript不允许直接操作对象的内存空间,实际上操作对象的引用而不是实际对象。
![b2bdcb1a0183b5d8ac56dbca5371a11b.png](https://i-blog.csdnimg.cn/blog_migrate/ac633a74cb931c7d193969e7d861a103.jpeg)
var dada = new Object();undefineddada.name = "dada";"dada"console.log(dada.name);VM158:1 dadaundefined
![125b25525a00afb6d2ca977a68289210.png](https://i-blog.csdnimg.cn/blog_migrate/bb5a3bdc3e414759f5a276178af9c65d.jpeg)
var da1 = "da1";undefinedda1.age = 12;12console.log(da1.age);VM272:1 undefinedundefined
基本类型的值添加属性,是不管用的,只能给引用类型的值动态地添加属性,才是有用的。
2
复制变量值
就是从一个变量向另一个变量复制 基本类型值 和 引用类型值
基本类型的值添加属性,是不管用的,只能给引用类型的值动态地添加属性,才是有用的。2复制变量值就是从一个变量向另一个变量复制 基本类型值 和 引用类型值
![4e52e137be78afa19e5f98fe5b75b074.png](https://i-blog.csdnimg.cn/blog_migrate/7313237655496fdccbdafea56952d6ba.jpeg)
da1中保存的值是12,使用da1的值来初始化da2时,da2中也保存了值12,但是d2中的值12和da1中的值12是完全独立的。这两个变量可以参与任何操作互不影响。
我自己是一名从事了多年开发的web前端老程序员,目前辞职在做自己的web前端私人定制课程,今年年初我花了一个月整理了一份最适合2019年学习的web前端学习干货,各种框架都有整理,送给每一位前端小伙伴,想要获取的可以关注我的头条号并在后台私信我:前端,即可免费获取。
从一个变量向另一个变量复制引用类型的值:
引用类型的值实际上是一个指针,是指向存储在堆中的一个对象,引用类型的复制,是将指向引用同一个对象,所以改变其中一个变量,另一个变量也会受到影响。
var da3 = new Object();var da4 = da3;da3.name = "dada";console.log(da4.name);
![0a05c893c9866fc2516cedade29af1c7.png](https://i-blog.csdnimg.cn/blog_migrate/46cbc30e6bc41ebbcd7f8d3288c25795.jpeg)
da3和da4指向同一个对象,da3添加name属性后,da4来访问这个属性,因为两个变量指向同一个对象,所以输出结果为dada。
3
参数传递:
在JavaScript中所有函数的参数都是按值传递的,参数按值传递的意思,和复制一样的,把函数外的值传递到函数内部。
function addNum(num){ num = num + 1; return num;}var da5 = 12;var result = addNum(da5);console.log(da5);console.log(result);
![884aa51ce38cc5312e115574fe54ee06.png](https://i-blog.csdnimg.cn/blog_migrate/02a10f87ad2d6579fced425181d79b0a.jpeg)
函数addNum有一个参数num,这个参数实际为函数的局部变量。调用这个函数,变量da5作为参数被传递给了这个函数,这个变量的值为12,所以参数num为12在这个addNum()函数中使用。
function setName(obj) { obj.name = "dada";}var da6 = new Object();setName(da6);console.log(da6.name);
![590300a0b16a3a17f456762328108611.png](https://i-blog.csdnimg.cn/blog_migrate/43be49b509652ebfcf2b3c0f2ecb255d.jpeg)
检测类型:
typeof操作符是用来检测一个变量是否是基本数据类型,如果变量的值为一个对象或null,那么这个typeof操作符下返回的就是object。
var da7 = "dada";var da8 = 12;var da9;var da10 = null;var da11 = new Object();console.log(typeof da7);console.log(typeof da8);console.log(typeof da9);console.log(typeof da10);console.log(typeof da11);
![1d4fc12b2385d161689c8ff343ba4e43.png](https://i-blog.csdnimg.cn/blog_migrate/8ed9d4da762163acdd6d07574e147dc9.jpeg)
instanceof操作符,是用来干什么的呢?判断是什么类型的对象。
// 前提先定义personconsole.log(person instanceof Object);console.log(person instanceof Array);console.log(person instanceof RegExp);
注意,所有的引用类型的值都是Object的实例,所以检测引用类型的值和Object构造函数时,instanceof操作符都是返回true。instanceof操作符检测基本类型的值,返回的则都是false。因为instanceof检测的都是什么类型的对象。
4
作用域:
当代码在一个环境中执行时,会创建变量对象的一个作用域链,这个作用域链的用途是 保证对执行环境有权访问的多有变量和函数的有序访问。全局执行环境的变量对象都是作用域链中的最后一个对象。
标识符解析是沿着作用域链一级一级地搜索标识符的过程。
var da12 = "dada"function changeDa(){ if(da12 === "dada"){ da12 = "da"; }else{ da12 = "da1"; }}changeDa();console.log(da12);
![a59658faad94ee7e25444633c6e3987d.png](https://i-blog.csdnimg.cn/blog_migrate/1a8ec2f5db8a1426aeb37deeab2c5e4e.jpeg)
函数changeDa()的作用域链包含两个对象:
它自己的变量对象,和,全局环境的 变量对象。
它自己的 定义着的arguments对象
var da12 = "dada"function changeDa(){ var anotherDa = "dadada"; function daDa(){ var tempDa = anotherDa; anotherDa = da12; da12 = tempDa; // 可以访问 tempDa, anotherDa,da12 } // 这里只能访问 da12,anotherDa daDa();}// 这里只能访问da12;changeDa();
![9f58f6d0c6fd3b3102decfa9f13cf19e.png](https://i-blog.csdnimg.cn/blog_migrate/4867a4f40c6c5865b8e4edf478dc0426.jpeg)
分析执行环境,有3个,一个为全局环境,一个为changeDa()的局部环境,一个为daDa()的局部环境。
全局环境中有一个变量da12,和一个函数changeDa()。
changeDa()的局部环境中有什么?
一个变量anotherDa,一个名为daDa()的函数。这个函数可以访问全局变量中的da12。
daDa()的局部环境中有什么?
一个变量tempDa,该变量只能在这个环境中访问。
无论是全局环境还是changeDa()的局部环境都无法访问tempDa。
![95dd9d166730db0c460e08211987577e.png](https://i-blog.csdnimg.cn/blog_migrate/587d7f19ab8d81de562457dea331c5df.jpeg)
![a0de7e12120ab6c52b4cca9082449ba4.png](https://i-blog.csdnimg.cn/blog_migrate/bbc14ccad9a83e69ef95535dd814473f.jpeg)
![cc6fb8e4625412eee72e0251f945e420.png](https://i-blog.csdnimg.cn/blog_migrate/fd32df0c3590c2de7aba900e47a9d826.jpeg)
为什么内部的daDa()可以访问其他两个环境中的所有变量呢?
因为那是它们两个的环境是它的父执行环境。
内部环境可以通过作用域链访问所有的外部环境,但是外部环境不能访问内部环境中的任何变量和函数,内部环境都可以向上搜索作用域链,查变量和函数名,不能向下搜索作用域链进入另一个环境。
对于daDa()函数,其中作用域链包含3个对象:
daDa()的变量对象,changeDa()的变量对象,全局变量对象。
过程:
daDa()函数的局部环境,会先开始搜索自己的变量对象中的变量和函数名,如果找不到,会向上搜索上一级的作用域链。
对于changDa()中的环境:
它包含两个对象::一为它自己的变量对象,二为全局变量对象。
即它不能访问daDa()函数的局部环境。
5
执行环境分两种:
一种为全局作用域,一种为局部作用域。
如何理解 try catch 延长了作用域链?
with语句和 try catch 都可以延长作用域链
with比较好理解,而且一般有性能问题,也不推荐用
try catch 是捕获Error对象的时候 会新开一个作用域吗?
还是说 catch的大括号内就是一个能访问到error对象的块级作用域?
try中的代码捕获到错误以后,会把异常对象推入一个可变对象并置于用域的头部,在catch代码块内部,函数的所有局部变量将会被放在第二个作用域对象中,catch中的代码执行完,会立即销毁当前作用域。
什么叫延长作用域链
执行环境(变量对象可谓是它的衍生物)、作用域、作用域链
![8ec73870d3b641f90fbfd8812bbb2586.png](https://i-blog.csdnimg.cn/blog_migrate/3a92e38027293d11c3f0e257e5773c9e.jpeg)
作用域:函数当前执行环境。
作用域链:执行环境产生的变量对象构成。 作用域链是保证函数在执行时能够正确访问需要的变量和函数。
作用域链最外层就是全局作用域
![8c996c2e8f738b051e6ca8032e4af2ac.png](https://i-blog.csdnimg.cn/blog_migrate/5e0c14ece995a72d8693936a5cccc866.jpeg)
var i = 0;function dada(){ console.log(i);}undefineddada();VM656:3 0undefine
在函数中是没有存在i的,但是在调用这个函数时会返回为0,这是为什么呢?这就是函数作用域链的作用。
延长一: try catch
![4b49c11c8e9b6323a0eff5800115c10b.png](https://i-blog.csdnimg.cn/blog_migrate/57c3fe8d5d75d7a7a41bc9ed28109108.jpeg)
![335fdf9fbf1f189ada17a2200d821cd6.png](https://i-blog.csdnimg.cn/blog_migrate/7293110dfa366357a4bbc2e080b39f27.jpeg)
(function(window){ try{ throw Error("出错误了"); }catch(e){ alert(e); //alert("Error: 出错误了") } console.log(e); //undefind})(window);
在执行catch语句块时,JavaScript自动把其执行环境添加作用域链中,但是该语句块执行完后又自动把该执行环境(变量对象)移除。
alert(e) == alert("Error:出现错误");console.log(e) == undefined;
IE结果:
alert(e) => alert("Error: 出错误了"); console.log(e) => object Error: 出错误了{description: "出错误了",message: "出错误了",name: "Error"}
延长二:with
![0313900a199c576511ab8102399115db.png](https://i-blog.csdnimg.cn/blog_migrate/c9e74d008b64462fd20e95484b631056.jpeg)
function da(){ console.log(location.href); } function da(){ with(location){ console.log(href); } }
两种方式是等价的:
前提是非严格模式下, 因为严格模式下不支持 with这种方式。
![26e363fb838c8464e75049a4f4ed34a7.png](https://i-blog.csdnimg.cn/blog_migrate/31310911e5ca54eefe0505c13456f98b.jpeg)
延长作用域的表现
![a2cb83caf18618bbec29cd8afdbaed6f.png](https://i-blog.csdnimg.cn/blog_migrate/aae97f5c35505ba1b36b401d13d5edf1.jpeg)
什么是作用域链?
我的理解就是,根据在内部函数可以访问外部函数变量的这种机制,用链式查找决定哪些数据能被内部函数访问。
想要知道js怎么链式查找,就得先了解js的执行环境。
每个函数运行时都会产生一个执行环境,而这个执行环境怎么表示呢?
js为每一个执行环境关联了一个变量对象。环境中定义的所有变量和函数都保存在这个对象中。
没有块级作用域:
if(true) { var da = "dada";}console.log(da);
![b0a6fd66c60cc6a5c21edda05278d816.png](https://i-blog.csdnimg.cn/blog_migrate/f88a28b0aa4e15f97ab1763c0daeb597.jpeg)
![25f7557102043bc8fc041d795c67f2d9.png](https://i-blog.csdnimg.cn/blog_migrate/44c68c5ec77dfe653ed9af95b4f7e4f7.jpeg)
function add(num1,num2){ var num = num1 + num2; return num;}undefinedvar result = add(1,2);undefinedconsole.log(result);VM962:1 3undefined
![9fec2b1170fb1d4a7c00289c428a40ae.png](https://i-blog.csdnimg.cn/blog_migrate/8ce5a0dd3a8c4766e4ca7aa5bbbc38ab.jpeg)
向上查询:
![c93027894cd6d3cc1b67419dd399583a.png](https://i-blog.csdnimg.cn/blog_migrate/9f193487810275e3cfb21dc74bf5d650.jpeg)
var da = "dada";function getDa(){ var da = "dadada"; return da;}console.log(getDa());
JavaScript中最常用的垃圾收集方式是标记清除,另一种不太常见的垃圾策略叫做引用计数。
基本类型值和引用类型值:
基本类型值在内存中占据固定的空间,保存在栈内存中,从一个变量向另一个变量复制基本类型的值,会创建这个值的一个副本,引用类型的值为对象,保存在堆内存中。
包含引用类型值的变量实际上包含的并不是对象本身,而是一个指向对象的指针。
typeof操作符判断的是一个值是哪种基本类型,instanceof操作符判断的是一个值是哪种引用类型。
执行环境分:
全局执行环境,函数执行环境。
每次进入一个新的执行环境时,都会创建一个用于搜索变量和函数的作用域链。
原文链接:https://mp.weixin.qq.com/s/rCpsvY7P40mMjT4pdqkoRw
作者:达达前端小酒馆