JS技巧

逗号运算符

var a = 0; 
var b = ( a++, 99 ); 
console.log(a);  // a will be equal to 1 
console.log(b);  // b is equal to 99

小数保留(注意,toFixed 方法返回 string 值)

var num =2.443242342;
num = num.toFixed(4);  // num will be equal to 2.4432

缓存数据(避免查询相同 DOM 多次)

var navright = document.querySelector('#right'); 
var navleft = document.querySelector('#left'); 

判断是否敲击了Enter键

$(document).keyup(function(event){ 
    if(event.keyCode ==13){ 
      $("#login").trigger("click"); 
    } 
});

获取本月最后一天


var nowDate = new Date();
var fullYear = nowDate.getFullYear();
var month = nowDate.getMonth() + 1; // getMonth 方法返回 0-11,代表1-12月
var date = nowDate.getDate();
var endOfMonth = new Date(fullYear, month, 0).getDate(); // 获取本月最后一天

将字符串转换为数字

最简单和最快的( jspref )的方式来实现,将使用+(加)算法。
var one = '1';
var numberOne = +one; // Number 1

对数组排序进行"洗牌"(随机排序)shuffle

var a = [1, 2, 3, 4, 5, 6, 7, 8];
var b = shuffle(a);
console.log(b); // [2, 7, 8, 6, 5, 3, 1, 4]

字符串安全连接

var one = 1;
var two = 2;
var three = '3';
var result = ''.concat(one, two, three); //"123"
var result = one + two + three; //"33"  而不是 "123"

"~~"操作符

Math.floor()替代品。如果执行失败,则返回0,这可能在用来代替Math.floor()失败时返回一个NaN的时候发挥作用。它将模仿Math.ceil()取负值和Math.floor()取正值。
// 单位移
console.log(~1337)    // -1338
// 双位移
console.log(~~47.11)  // -> 47
console.log(~~-12.88) // -> -12

~位运算符

将-1转换为0
var someText = 'text';
!!~someText.indexOf('tex'); // someText 包含 "tex" - true
!~someText.indexOf('tex'); // someText 不包含 "tex" - false
~someText.indexOf('asd'); // someText 不包含 "asd" - false
~someText.indexOf('ext'); // someText 包含 "ext" - true

 js不允许出现“-”字符,如font-size:style.fontSize;font-weight:style.fontWeight;
ie8浏览器下出现不刷新时, url:"../../..?t="+new Date().getTime();

根据URL获取HTML

    url="/usercenter/enterprise/conundrumDetails";
$.ajax({
type: "GET",
url: url,
data:{"id":artID,"expID":authorID},
dataType: "html",
success: function (content) {
var html=$(content).find("div[name='artDetail']")
$("#id-artDetail-contianer").html(html)
}
});
~~作用
其实是一种利用符号进行的类型转换,转换成数字类型
~~true == 1
~~false == 0
~~"" == 0
~~[] == 0
~~undefined ==0
~~!undefined == 1
~~null == 0
~~!null == 1

字符串拼接总结
1.通过'+'进行拼接
var arr =['今天',昨天','明天'];
$(
    '<div class="show">'+'<ul class="app">'+'<li>'+arr[0]+'</li>'+'<li>'+arr[1]+'</li>'+'<li>'+arr[2]+'</li>'+'</ul>'+'</div>'
).appendTo('.bo')//创建新的节点并插入到.bo

这种方法大家最常用,但是有个不好的就是 自己在做模版的时候,常常会因为少写或者多写分号而出错,而且这种出错不易察觉,时常会浪费很多宝贵的时间。

2.通过数组去拼接
 var arr =['今天','昨天','明天'];
var str ='';
str+=['<div class="show">','<ul>','<li><a href="">'+arr[0]+'</a></li>','<li><a href="">'+arr[1]+'</a></li>','<li><a href="">'+arr[2]+'</a></li>','</ul>','</div>'
].join('');
$('.bo').append(str);

这种方式显得高大上一些,而且使用的频率也非常大。博主经常会使用这种方式,因为这种方式不容易出错,及时出错了也可以立马发现错误。

3.最近新学的一种字符串拼接方式,比前面两种方式显得更为简洁一些
var dataList = '<div id="box">
<ul class="LearnList">
<li class="list">HTML</li>
<li class="list">CSS</li>
<li class="list">JS</li>
<li class="list">NODE</li>
<li class="list">ANGLUAR</li>
<li class="list">JSON</li>
</ul>
</div>'

第三种方法比较灵活,这种方式要注意一点,也是实现的关键:每一行的最后,都加上转义斜线,但没有后续字符,只有个。

原文地址:https://www.cnblogs.com/guanguan-/p/7017614.html