js遇到问题汇总

2018/01/23 15:14
阅读数 14

 1、原生js获取同级的兄弟节点

<!DOCTYPE html>
<html>
<head>
<meta
charset="utf-8">
<title>蚂蚁部落</title>
<script
type="text/javascript">
window.onload=function(){
  var oli=document.getElementById("antzone");
  var obox=oli.parentNode;
  var lis=obox.children;
  for(var i=0;i<lis.length;i++){
    if(lis[i]!=oli){
      lis[i].style.color="red";
    }
  }
}
</script>
</head>
<body>
<ul
id="box">
  <li>蚂蚁部落一</li>
  <li
id="antzone">蚂蚁部落二</li>
  <li>蚂蚁部落三</li>
  <li>蚂蚁部落四</li>
</ul>
</body>
</html>

 2、关于字符串、undefined、{}、null在代码中true还是false

字符串会自动转为true;

undefined会转为false,但是有时候获取值时,undefined会为字符串,此时为true;

{} 空对象会为true,那么如何判断一个对象是否为空?

var a = {};
if(!a){ console.log(1);}
else if(a == null) { console.log(2);} 
else { console.log(3);}
// 输出3

var b = {};
if(b == {}){ console.log(4);}
if(b == '{}') { console.log(5);} 
if(typeof(b) == 'object') { console.log(6);}
// 输出6

var c = {};
if(JSON.stringify(c) == "{}"){ console.log(7);}
// 输出7


var d = {};
var e = {id:111};
if(d.id){ console.log(8);}
if(e.id){ console.log(9);}
//输出9

小结:显然代码3的判断方式比较“强势”,但效率明显不如代码4的判断方法

 3、实现对数组、对象的深层拷贝

  当组件间传递对象时,由于此对象的引用类型指向的都是一个地址(除了基本类型跟null,对象之间的赋值,只是将地址指向同一个,而不是真正意义上的拷贝),如下

数组:
var a = [1,2,3];
var b = a;
b.push(4); // b中添加了一个4
alert(a); // a变成了[1,2,3,4]

对象:
var obj = {a:10};
var obj2 = obj;
obj2.a = 20; // obj2.a改变了,
alert(obj.a); // 20,obj的a跟着改变 

  这就是由于对象类型直接赋值,只是将引用指向同一个地址,导致修改了obj会导致obj2也被修改

  所以在vue中,如果多个组件引用了同一个对象作为数据,那么当其中一个组件改动对象数据时,其他对象的数据也会同步改动。有这种双向绑定的需要的话,那么自然是最好的,但如果不需要这种绑定而希望各组件的对象数据之间相互独立,即是互不关联的对象副本的话,可以用下面的方法解决

var obj={};  
obj=JSON.parse(JSON.stringify(a));

 

展开阅读全文
打赏
0
0 收藏
分享
加载中
更多评论
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部