关于js的笔记

1.Math.random() * (8) | 0;//随机向下取整

2.动态加入数组元素

var timearr=[00, 10, 10, 10, 10, 00, 10, 10, 10, 10, 00, 10, 10, 10, 10, 00, 10, 10, 10, 10,000, 10, 10, 10, 10, 00, 10, 10, 10, 10, 00, 10, 10, 10, 10, 00, 10, 10, 10, 10, 00, 10, 10, 10, 10, 00, 10, 10]

var value=[0.368, 0.378, 0.381, 0.382, 0.384, 0.386, 0.385, 0.381, 0.385, 0.382, 0.384, 0.379, 0.358, 0.344, 0.322, 0.265, 0.262, 0.212, 0.254, 0.239, 0.215, 0.238, 0.252, 0.303, 0.284, 0.286, 0.254, 0.282, 0.271, 0.251, 0.239, 0.281, 0.256, 0.249, 0.258, 0.299, 0.305, 0.259, 0.285, 0.272, 0.293, 0.272, 0.288, 0.262, 0.306, 0.31, 0.326, 0.356]

var newvalue=[];
value.forEach( function(element, index) {
    newvalue.push([timearr[index],value[index]])
            });

 3.Array.map()方法

var testObjs=[{"age":1,"name":"张"},{"age":2,"name":"李"},{"age":3,"name":"陈"}],newObj,newObj00;
    //三个参数:
    testObj:当前被遍历的元素;
    i:当前元素的索引;
    array:执行当前map方法的原数组testObjs
    newObj=testObjs.map(function(testObj, i,array) {
        console.log(testObj);
        console.log(array)
        var ageArr= {"age":testObj.age}
        return ageArr;
    })
    console.log(newObj)//[{"age":1},{"age":2},{"age":3}]

   newObj00=testObjs.sort(function (a,b) {
    return a.age-b.age //使按照年龄有小到大排序
   })

 

 4.for-in循环

有个很重要的hasOwnProperty()方法,当遍历对象属性的时候可以过滤掉从原型链上下来的属性。

var i, hasOwn = Object.prototype.hasOwnProperty;
for (i in man) {
    if (hasOwn.call(man, i)) { // 过滤
        console.log(i, ":", man[i]);
    }
}

 5.

var pos=[6,8],size={"viewSize":[12,10]},obj;
function qq(pos,size) {
    obj = {
        top: 10
    };
    obj[['left', 'right'][+(pos[0] < size.viewSize[0] / 2)]] = 30;
    //先判断了小括号内表达式的真假,若为真则返回1,假则返回0。
    //把得到的1或0作为数组['left', 'right']的索引,来确定要把30赋给谁
    return obj;
}
qq(pos,size);
console.log(obj)//object {top: 10, left: 30}

 6.break & continue

<!DOCTYPE html>
<html>
<body>

<p>点击下面的按钮来执行循环,该循环会跳过 i=3 的步进。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>

<script>
function myFunction()
{
var x="",i=0;
for (i=0;i<10;i++)
  {
  if (i==3)
    {
    break;//只要满足条件,无论break还是continue,该次循环if后的语句都不会执行。不同之处为,若为break,则此后的循环停止,若为continue,则 i!=3之后的循环将会继续执行
    }
  x=x + "The number is " + i + "<br>";
  }
document.getElementById("demo").innerHTML=x;
}
</script>

 7.style.pixelLeft:
返回定位元素左边界偏移量的整数像素值.因为属性的非像素值返回的是包含单位的字符串,例如,30px. 利用这个属性可以单独处理以像素为单位的数值.
通俗点,document.images[0].style.pixelLeft=100
意思就是images[0]这个对象离 左边 的距离为 100。

而且你这个对象的CSS样式里也应该有position属性。
这是JS内置的属性,很有意思,可以做出很多有趣的特效。

8.pop()方法删除并得到数组最后一个元素,会改变原数组长度,在ajax请求中慎用,可换用slice(-1),slice()方法不会改变原数组

9.使用正则

var time = "/Date(1493811611580)/";
console.log(time.replace(/(/Date()|()/)/g, ''))//对()转义
time = time.replace(/(/Date()|()/)/g, '') - 0;
console.log(new Date(time).toLocaleTimeString().replace(/(^D*)|(:d+$)/g, ''));//从 开头开始匹配非数字的部分 或者 结尾处冒号后面有一个或者多个数字的部分

 10.匹配ie

if (!(/msie [6|7|8|9]/i.test(navigator.userAgent))){
    new WOW().init();
};

 11

//通过设置定时器让连续触发的resize()事件间断执行,优化性能 
$.resizeWaiter = false; $(window).resize(function() { if (!$.resizeWaiter) {//如果不为真时执行 console.log(1) $.resizeWaiter = true; setTimeout(function() { ChartHistoryData.resize(); $.resizeWaiter = false; }, 500); } });

 12

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
	<script>window.jQuery || document.write('<script src="../js/minified/jquery-1.11.0.min.js"></script>')</script>//当不存在jquery对象时会执行||后
的语句添加script标签。
http://blog.csdn.net/qq_34986769/article/details/52160532
http://blog.csdn.net/jiaolong724/article/details/8532828

  

原文地址:https://www.cnblogs.com/rage-the-dream/p/6443288.html