Rumah > hujung hadapan web > tutorial js > 总结js常用函数和常用技巧

总结js常用函数和常用技巧

高洛峰
Lepaskan: 2016-10-15 09:31:23
asal
1353 orang telah melayarinya

Ajax请求

jquery ajax函数

我自己封装了一个ajax的函数,代码如下:

var Ajax = function(url, type success, error) {
    $.ajax({
        url: url,
        type: type,
        dataType: 'json',
        timeout: 10000,
        success: function(d) {
            var data = d.data;
            success && success(data);
        },
        error: function(e) {
            error && error(e);
        }
    });};// 使用方法:Ajax('/data.json', 'get', function(data) {
    console.log(data);});
Salin selepas log masuk

jsonp方式

有时候我们为了跨域,要使用jsonp的方法,我也封装了一个函数:

function jsonp(config) {
    var options = config || {};   // 需要配置url, success, time, fail四个属性
    var callbackName = ('jsonp_' + Math.random()).replace(".", "");
    var oHead = document.getElementsByTagName('head')[0];
    var oScript = document.createElement('script');
    oHead.appendChild(oScript);
    window[callbackName] = function(json) {  //创建jsonp回调函数
        oHead.removeChild(oScript);
        clearTimeout(oScript.timer);
        window[callbackName] = null;
        options.success && options.success(json);   //先删除script标签,实际上执行的是success函数
    };
    oScript.src = options.url + '?' + callbackName;    //发送请求
    if (options.time) {  //设置超时处理
        oScript.timer = setTimeout(function () {
            window[callbackName] = null;
            oHead.removeChild(oScript);
            options.fail && options.fail({ message: "超时" });
        }, options.time);
    }};// 使用方法:jsonp({
    url: '/b.com/b.json',
    success: function(d){
        //数据处理
    },
    time: 5000,
    fail: function(){
        //错误处理
    }       });
Salin selepas log masuk

常用正则验证表达式

手机号验证

var validate = function(num) {
    var exp = /^1[3-9]\d{9}$/;
    return exp.test(num);};
Salin selepas log masuk

身份证号验证

var exp = /^[1-9]{1}[0-9]{14}$|^[1-9]{1}[0-9]{16}([0-9]|[xX])$/;
Salin selepas log masuk

ip验证

var exp = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
Salin selepas log masuk

常用js函数

返回顶部

$(window).scroll(function() {
    var a = $(window).scrollTop();
    if(a > 100) {
        $('.go-top').fadeIn();
    }else {
        $('.go-top').fadeOut();
    }});$(".go-top").click(function(){
    $("html,body").animate({scrollTop:"0px"},'600');});
Salin selepas log masuk

阻止冒泡

function stopBubble(e){
    e = e || window.event;  
    if(e.stopPropagation){
        e.stopPropagation();  //W3C阻止冒泡方法  
    }else {  
        e.cancelBubble = true; //IE阻止冒泡方法  
    }  }
Salin selepas log masuk

全部替换replaceAll

var replaceAll = function(bigStr, str1, str2) {  //把bigStr中的所有str1替换为str2
    var reg = new RegExp(str1, 'gm');
    return bigStr.replace(reg, str2);}
Salin selepas log masuk

获取浏览器url中的参数值

var getURLParam = function(name) {
    return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)', "ig").exec(location.search) || [, ""])[1].replace(/\+/g, '%20')) || null;};
Salin selepas log masuk

深度拷贝对象

function cloneObj(obj) {
    var o = obj.constructor == Object ? new obj.constructor() : new obj.constructor(obj.valueOf());
    for(var key in obj){
        if(o[key] != obj[key] ){
            if(typeof(obj[key]) == 'object' ){
                o[key] = mods.cloneObj(obj[key]);
            }else{
                o[key] = obj[key];
            }
        }
    }
    return o;}
Salin selepas log masuk

数组去重

var unique = function(arr) {
    var result = [], json = {};
    for (var i = 0, len = arr.length; i < len; i++){
        if (!json[arr[i]]) {
            json[arr[i]] = 1;
            result.push(arr[i]);  //返回没被删除的元素
        }
    }
    return result;};
Salin selepas log masuk

判断数组元素是否重复

var isRepeat = function(arr) {  //arr是否有重复元素
    var hash = {};
    for (var i in arr) {
        if (hash[arr[i]]) return true;
        hash[arr[i]] = true;
    }
    return false;};
Salin selepas log masuk

生成随机数

function randombetween(min, max){
    return min + (Math.random() * (max-min +1));}
Salin selepas log masuk

操作cookie

own.setCookie = function(cname, cvalue, exdays){
    var d = new Date();
    d.setTime(d.getTime() + (exdays*24*60*60*1000));
    var expires = &#39;expires=&#39;+d.toUTCString();
    document.cookie = cname + &#39;=&#39; + cvalue + &#39;; &#39; + expires;};own.getCookie = function(cname) {
    var name = cname + &#39;=&#39;;
    var ca = document.cookie.split(&#39;;&#39;);
    for(var i=0; i< ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == &#39; &#39;) c = c.substring(1);
        if (c.indexOf(name) != -1) return c.substring(name.length, c.length);
    }
    return &#39;&#39;;};
Salin selepas log masuk

知识技巧总结

数据类型

underfined、null、0、false、NaN、空字符串。他们的逻辑非结果均为true。

闭包格式

好处:避免命名冲突(全局变量污染)。

(function(a, b) {
    console.log(a+b);  //30})(10, 20);
Salin selepas log masuk

截取和清空数组

var arr = [12, 222, 44, 88];
arr.length = 2;   //截取,arr = [12, 222];  
arr.length = 0;   //清空,arr will be equal to [].
Salin selepas log masuk

获取数组的最大最小值

var numbers = [5, 45822, 120, -215];
var maxInNumbers = Math.max.apply(Math, numbers);   //45822
var minInNumbers = Math.min.apply(Math, numbers);   //-215
Salin selepas log masuk

浮点数计算问题

0.1 + 0.2 == 0.3   //false
Salin selepas log masuk

为什么呢?因为0.1+0.2等于0.30000000000000004。JavaScript的数字都遵循IEEE 754标准构建,在内部都是64位浮点小数表示。可以通过使用toFixed()来解决这个问题。

数组排序sort函数

var arr = [1, 5, 6, 3];    //数字数组
arr.sort(function(a, b) {
    return a - b;   //从小到大排
    return b - a;   //从大到小排
    return Math.random() - 0.5;   //数组洗牌
});
Salin selepas log masuk
var arr = [{   //对象数组
    num: 1,
    text: &#39;num1&#39;
}, {
    num: 5,
    text: &#39;num2&#39;
}, {
    num: 6,
    text: &#39;num3&#39;
}, {
    num: 3,
    text: &#39;num4&#39;
}];   
arr.sort(function(a, b) {
    return a.num - b.num;   //从小到大排
    return b.num - a.num;   //从大到小排
});
Salin selepas log masuk

对象和字符串的转换

var obj = {a: &#39;aaa&#39;, b: &#39;bbb&#39;};
var objStr = JSON.stringify(obj);    // "{"a":"aaa","b":"bbb"}"
var newObj = JSON.parse(objStr);     // {a: "aaa", b: "bbb"}
Salin selepas log masuk

git笔记

git使用之前的配置

1.git config --global user.email xxx@163.com
2.git config --global user.name xxx
3.ssh-keygen -t rsa -C xxx@163.com(邮箱地址)      // 生成ssh
4.找到.ssh文件夹打开,使用cat id_rsa.pub    //打开公钥ssh串
5.登陆github,settings - SSH keys  - add ssh keys (把上面的内容全部添加进去即可)
Salin selepas log masuk

说明:然后这个邮箱(xxxxx@gmail.com)对应的账号在github上就有权限对仓库进行操作了。可以尽情的进行下面的git命令了。

git常用命令

1、git config user.name  /  user.email     //查看当前git的用户名称、邮箱
2、git clone https://github.com/jarson7426/javascript.git  project  //clone仓库到本地。
3、修改本地代码,提交到分支:  git add file   /   git commit -m “新增文件”
4、把本地库推送到远程库:  git push origin master
5、查看提交日志:git log -5
6、返回某一个版本:git reset --hard 123
7、分支:git branch / git checkout name  / git checkout -b dev
8、合并name分支到当前分支:git merge name   /   git pull origin
9、删除本地分支:git branch -D name
10、删除远程分支: git push origin  :daily/x.x.x
11、git checkout -b mydev origin/daily/1.0.0    //把远程daily分支映射到本地mydev分支进行开发
12、合并远程分支到当前分支 git pull origin daily/1.1.1
13、发布到线上:
    git tag publish/0.1.5
    git push origin publish/0.1.5:publish/0.1.5
14、线上代码覆盖到本地:
    git checkout --theirs build/scripts/ddos
    git checkout --theirs src/app/ddos
Salin selepas log masuk


Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan