JS零碎（一）

1.关于"||"和"&&"

  • 几乎所有语言中||和&&都遵循“短路”原理，
  • 如&&中第一个表达式为假就不会去处理第二个表达式，而||正好相反。
  • js也遵循上述原则。
  • 当||时，找到为true的分项就停止处理，并返回该分项的值，否则执行完，并返回最后分项的值。
  • 当&&时，找到为false的分项就停止处理，并返回该分项的值。
    var a = "" || null || 3 || 4;//3
alert(a);
var b = 4 && 5 && null && "0";//null
alert(b);

    const a = 8 && "haha";  // haha   第一个是对的，所以执行下一个
const b = 0 && "haha";  // 0      第一个是0,是错的，所以不执行下一个
console.log(a,b);
const c = 8 || "haha";  // 8      第一个是对的，懒得执行下一个了
const d = 0 || "haha";  // haha   第一个是错的，用下一个来代替
console.log(c,d);

2.形参实参、自执行函数的与世隔绝。对象的引用传递。

var obj1 = {x:1};
var obj2 = {x:2};

(function(obj2) {
  delete obj2.x;
});
// 这里其实是没有办法执行的，因为缺少 ()
// 而加了()也会报错，因为没有传参。
console.log(obj1.x, obj2.x); // 1 2
console.log(obj1.x + obj2.x); // 3

(function(obj2) {   // 形参
  delete obj2.x;
})(obj1);     // 实参，这里删除的是 obj1 的对象
console.log(obj1.x, obj2.x); // undefined 2
console.log(obj1.x + obj2.x); // NaN

3.默认的body marginTop

平时我们的 *{margin:0; padding:0;}对于 body元素 来说，实际上用到的地方是marginTop,其大小为8px

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
  #left {
    background: red;
    width: 100px;
    position: absolute;
    left: 0;
    height: 100px;
  }
  </style>
  <script type="text/javascript">
    window.onload = function() {
      var oId = document.getElementById("left");
      var oBody = document.getElementsByTagName("body")[0];
      console.log(getStyle(oId, 'paddingTop')); //0px
      console.log(getStyle(oBody, 'marginTop')); //!!!!!!--8px
      console.log(getStyle(oBody, 'paddingTop')); //0px
    }
    function getStyle(obj, attr) {
      if (obj.currentStyle) {
        return obj.currentStyle[attr];
      } else {
        return document.defaultView.getComputedStyle(obj, null)[attr];
      }
    }
  </script>
</head>
<body>
  <div id="left"></div>
  <div id="main"></div>
  <div id="right"></div>
</body>
</html>

4. 切记replace是给字符串用的。

complete.

posted @ 2017-05-16 15:40  海客无心x  阅读(164)  评论(0)  编辑  收藏  举报