js中let和var定义变量的区别
发布时间:2025-05-20 02:01:42 发布人:远客网络
一、js中let和var定义变量的区别
1:作用域不一样,var是函数作用域,而let是块作用域,也就是说,在函数内声明了var,整个函数内都是有效的,比如说在for循环内定义了一个var变量,实际上其在for循环以外也是可以访问的,而let由于是块作用域,所以如果在块作用域内(比如说for循环内)定义的变量,在其外面是不可被访问的,所以let用在for(let i; i< n; i++)是一种很推荐的写法
2.let不能在定义之前访问该变量,但是var是可以得。也就是说,let必须是先定义,再使用,而var先使用后声明也行,只不过直接使用但是没有却没有定义的时候,其值为undefined,这块要注意,这一块很容易出问题,这也是个人认为的let比var更好的地方,至于为啥会有这种区别呢,实际上var有一个变量提升的过程。也就是说,当这个函数的作用域被创建的时候,实际上var定义的变量都会被创建,并且如果此时没有初始化的话,则默认会初始化一个undefined。
3.let不能被重新定义,但是var是可以的。这个呢,我个人认为,从规范化的角度来说,是更推荐的,比如说,你在前面声明了一个变量,后来写代码,因为忘了之前的代码逻辑,又声明了一个同名的变量,如果这俩变量逻辑不一样,并且后面都要用的话,很容易出问题,且不容易维护。
总之呢,let从规范化的角度来说,要比var要进步了很大一步。所以一般情况下的话,推荐用let,const这些。当然啦,如果相对var,const和let有更深入的了解,推荐几篇小文章,这样你就会对其相关知识点有更加深入的了解了。Javascript基础之-var
Javascript基础之-var,let和const深入解析(一)
Javascript基础之-var,let和const深入解析(二)
二、js中如何定义全局变量
JavaScript声明全局变量三种方式的异同\x0d\x0a\x0d\x0aJavaScript中声明变量格式:var(关键字)+变量名(标识符)。\x0d\x0a方式1\x0d\x0avar test;\x0d\x0avar test= 5;\x0d\x0a\x0d\x0a需注意的是该句不能包含在function内,否则是局部变量。这是第一种方式声明全局变量。\x0d\x0a \x0d\x0a方式2\x0d\x0atest= 5;\x0d\x0a\x0d\x0a没有使用var,直接给标识符test赋值,这样会隐式的声明了全局变量test。即使该语句是在一个function内,当该function被执行后test变成了全局变量。\x0d\x0a \x0d\x0a方式3\x0d\x0awindow.test;\x0d\x0awindow.test= 5;\x0d\x0a\x0d\x0a这种方式经常被用到一个匿名函数执行后将一些函数公开到全局。如JQuery1.5中最末一句\x0d\x0awindow.jQuery= window.$= jQuery;
三、在JS中实现继承有哪几种方式
这次给大家带来在JS中实现继承有哪几种方式,在JS中实现继承的注意事项有哪些,下面就是实战案例,一起来看一下。
我们都知道,面向对象的三大特征——封装、继承、多态。封装无非就是属性和方法的私有化,所以我们JS中提供了私有属性和私有方法。
而JS中并没有多态,因此我们说JS是一门基于对象的语言,而非面向对象的语言。那么,面向对象三大特征中,在JS中最重要的就是继承了。
使用一个子类继承另一个父类,子类可以自动拥有父类的属性和方法。
>>>继承的两方,发生在两个类之间。
所以,所谓的继承,无非就是让子类,拥有父类的所有属性和方法。那么,在JS中,我们要模拟实现这一步,有三种常用的方法可以实现。
分别是:扩展Object的prototype实现继承、使用call和apply实现继承、使用原型实现继承。
二、扩展Object的prototype实现继承
扩展Object实现继承的本质,是我们自己写了一个方法,将父类的所有属性和方法通过遍历循环,逐个复制给子类。
3:通过原型给Object对象添加一个扩展方法。
Object.prototype.customExtend=function(parObj){
for(variinparObj){//通过for-in循环,把父类的所有属性方法,赋值给自己
首先,要使用这种方式显示继承,我们再来回顾一下call和apply两个函数的作用:
call和apply:通过函数名调用方法,强行将函数中的this指向某个对象;
call写法:func.call(func的this指向的obj,参数1,参数2...);
apply写法:func.apply(func的this指向的obj,[参数1,参数2...]);
那么,我们使用这两个函数实现继承的思路就是:在子类中,使用父类函数调用call或apply,并将父类的this,强行绑定为子类的this。那这样,父类绑定在this上的属性和方法,不就顺利成章的绑定到子类的this上了吗?
3:在子类中通过call方法或者apply方法去调用父类。
Parent.call(this,....);//将父类函数中的this,强行绑定为子类的this}
使用原型实现继承,是比较简单而且比较好理解的一种,就是将子类的prototype指向父类的对象就可以啦。
3:把在子类对象的原型对象声明为父类的实例。
要理解闭包,首先,我们要了解一下JS中的作用域:
在JS中,函数为唯一的局部作用域,而if、for等其他{}没有自己的作用域
所以,函数外不能访问局部变量。其实,变量在函数执行完毕以后,占用的内存就会被释放。
在概述中,我刚刚提到,面向对象的三大特征中的“封装”,我们可以用函数的私有属性来实现。这个私有属性,其实也就是局部变量。
但是我们都知道,封装是限制外部的访问,并不是直接拒绝外部的访问,那么我们在函数中私有的属性,怎么才能在外部访问呢?答案就是闭包!
JS中,提供了一种"闭包"的概念:在函数内部,定义一个子函数,可以用子函数访问父函数的私有变量。执行完操作以后,将子函数通过return返回。
functionfunc2(){varnum= 1;functionfunc3(){varsum= num+10;
②让函数的变量始终存在于内存中,而不被释放。
我们来做这样一个功能:页面中有6个li,要求实现点击每个li,弹出这个li对应的序号。
那JS代码呢?我觉得很大一部分同学会这样写:
varlis= document.getElementsByTagName("li");for(vari=0;i
alert("您/点击了第"+i+"个li!");
那么,这样对吗?不对!!!我们来分析一下:页面加载的时候,JS代码会全部执行,也就是上面的for循环在页面加载完就已经执行完了!那,这个i就已经变成了lis.length。也就是说,你在点击li的时候,无论点击第几个,弹出的都是lis.length。
那么,我们应该怎么修改呢?看代码!
varlis= document.getElementsByTagName("li");for(vari=0;i
alert("您/点击了第"+j+"个li!");
区别在哪?明眼人一眼就看穿我们在for循环外面嵌套了一层自执行函数!这种函数套函数的形式,就形成了闭包!
那作用呢?我们刚才强调,闭包的自执行函数会有自己的作用域。在函数里面的代码没有执行的时候,自执行函数中的j是不会被释放掉的!
也就是说,循环转了6次!生成了6个独立的函数空间,每个空间中有自己独立的j变量,所以最终不会出现所有li点击都是lis.length的情况!
相信看了本文案例你已经掌握了方法,更多精彩请关注Gxl网其它相关文章!
echarts实现饼图扇区统计表的添加点击事件
JavaScript面向对象与this指向(附代码)