用js进行平时项目开发的时候会经常面临着一个问题,就是要对变量的作用域进行分析判断,今天就来浅谈一下自己如何来进行区分的。
1.在js中这里指的是es3.0,没有块级作用域的概念,只存在函数作用域,即一个function里的变量为一个单独的作用域,记住要用var进行声明,否则就会上升至全局变量。其实这个还是比较好区分的,下面来给段代码
var b=2; function a(){ var b =1; c(); console.log(b)}; function c (){console.log (b)} ; a(); 输出结果为2,1
因为在js中函数的函数声明的那一刻起它的作用域就相应的产生了,这就是js里的词法作用域,声明的时候就确定了作用域的范围,就像上面的代码中c函数声明时其产生的作用域是全局作用域,再a函数中调用c并不能改变c的作用域链,所以第一个输出的为全局变量2,第二个就简单了,先从a函数得作用域开始寻找b如果能找到就返回,不能找到就去父级查找,此情景可以找到就输出1
2.在前端页面如果要去写后台进行数据操作的sql语句时,最好是把这些语句给拆解到后台实现,因为这里涉及到安全问题,sql不能写select*from tablename 除了能造成性能问题外还存在一个安全问题,能过截获这个来得知你的表结构^_^
3关于js的作用域易错点,.js的赋值顺序为自右向左
functionfoo() {
var a = b = 0;
//.. .按照js的赋值顺序自右向左,首先b = 0,此时b为全局变量,然后将 var a = b ;此时a为局部变量 a = 0;
//可以采用链式的声明方式:即 var a ,b; a=b=0;此时a,b都为局部变量
}
4:之前在做angular开发一个项目的时候遇到了一个问题:客户端请求到服务器然后服务器写文件到客户端实现文件的下载,一开始我只是用了$http.get(url)去向后端发送一个请求,然后后端生成一个文件然后将该文件以流的形式写入到浏览器,也许是第一次接触该需求并不太了解客户端需要进行什么操作,反而把精力集中到后端的研究上(java 只是懂那么一点),花了我一整天的时间啊,然后才发现是采用了ajax发送请求后,并没有对返回的信息做任何处理,以至于没有出现文件在浏览器上下载的效果,最后有两个个解决方案是:1:使用form表单提交的方式进行请求,返回后的数据是由form表单根据表单结构自动完成的并不需要用代码来对数据进行处理,而ajax请求是需要用代码来对返回的数据进行处理
2:仍然使用ajax的方式进行请求 不过需要对返回的数据进行处理 :$http({ method:"post",url:url,data:data,headers:{'Content-Type':'application/x-www-form-urlencoded'}}).success(function(){ console.log("success")})
}
5:当两个span元素都设置为display:inline-block时会出现两个元素水平方向没有对齐,解决这个问题可以利用vertical-align:top ,把元素的顶端与行中最高元素的顶端对齐,不过这个属性ie并不支持
6.当删除数组的元素采用:users.splice(users.indexOf(user),1)进行操作就可以避免传统删除时由于数组长度变化而index仍加1而造成的删除位置不对的错误
7.判断一个变量是否为数组,对象,function等类型
Object.prototype.toString.call(param)=='[object Array]'
8.实现深copy的性能最快的方法
let obj 1 = json.parse(json.stringify(obj));
9.实现统计字符串的字节长度方法
function charAtLeng(str){
var num = str.length;
for(var i=0;i<str.length;i++){
if(str[i].charCodeAt()>255){
num++
}
}
return num
}
10.使用哈希算法对数组进行去重
function temple(array){
var newArray = [],object={};
for(var i=0,lengths=array.length;i<lengths;i++){
if(!object[array[i]]){
object[array[i]] = 1;
newArray.push(array[i])
}
}
return newArray
}
11、 判断一个字符串中出现次数最多的字符,统计这个次数
var obj= {},index = 0,key='',count=0;
function checkString(str){
for(var i=0;i<str.length;i++){
obj[str[i]]?obj[str[i]]++:obj[str[i]] = 1//如果存在就在原来的基础上给value加1,如果是第一次出现就赋值为1
}
for(var j in obj){
if(obj[j]>count){
count = obj[j]//如果值大就赋值给count
key = j;
}
}
return '出现频率最高的为'+key+'其中出现的次数为'+count
}
12、获取数组或者字符串中的最大值或最小值
//最大值
Math.max.apply(null,array)//相当于直接调用Math.max() 方法,不过由于提供的方法不支持数组类型的参数,可以用这个方法进行规避
Math.max(string) 或Math.max.call(null,string)
//最小值
Math.min.apply(null,array)
Math.min(string) 或Math.min.call(null,string)
13.判断浏览器内核(看是否为chrome浏览器)
var ua = navigator.userAgent;
var isChrome = ua.indexOf('Chrome');
14.判断一个值是否是数组 使用Array.isArray(value)方法
15.Object.keys(obj).length//返回对象中有多少元素,可以用来判断对象是否为空
16.const arr = [...new Set([0, 1, 1, null, null])]; 对数组进行去重,返回的arr为[0,1,null]