函数记录
作者:datura_lj
链接:https://www.jianshu.com/p/2e3697ca43b3
來源:简书



1. 数组(arr)和对象(json)的深拷贝

使用方法:

var arr = [1, 3, 5, {a: 5}]
var newArr =cloneObject(arr,true);
newArr[3].a = 9
console.log(arr, newArr)

补充:

//判断是否为数组
1.   Object.prototype.toString.call(obj) === '[object Array]'
2.   obj.constructor === Array

源码:

function cloneObject( obj, deep ){
   if ( obj === null || obj === undefined || typeof (obj) !== 'object' ){
      return obj;
   }
   var deep = !!deep;
   var cloned = null;
   if ( obj.constructor === Array ){//Object.prototype.toString.call(obj) === '[object Array]'
      if ( deep === false ) return obj;
      cloned = [];
      for ( var i in obj ){
         cloned.push( cloneObject( obj[i], deep ) );
      }
      return cloned;
   }
   cloned = {};
   for ( var i in obj ){
      cloned[i] = deep ? cloneObject( obj[i], true ) : obj[i];
    }
    return cloned;
}
2. localStorage存储的封装

使用方法:

storage.set('datura_lj','666');
alert(storage.get('datura_lj'));
storage.del('datura_lj');

源码:

var storage = {
     isLocalStorage: !!window.localStorage,
     set: function (key, value) { //设置缓存
              if (this.isLocalStorage) {//判断浏览器是否支持storage
                    window.localStorage.setItem(key, value);
               } else {
                    var expireDays = 365; //失效时间
                    var exDate = new Date();
                    exDate.setTime(exDate.getTime() + expireDays * 24 * 60 * 60 * 1000);
                    document.cookie = key + "=" + escape(value) + ";expires=" + exDate.toGMTString();
               }
            },
     get: function (key) { //读取缓存
                if (this.isLocalStorage) {
                    return window.localStorage.getItem(key);
                } else {
                    var arr, reg = new RegExp("(^| )" + key + "=([^;]*)(;|$)");
                    if (arr = document.cookie.match(reg)) {
                        return unescape(arr[2]);
                    } else {
                        return null;//如果查找不到返回null
                    }
                }
            },
      del: function (key) { //删除缓存
                if (this.isLocalStorage) {
                    localStorage.removeItem(key);
                } else {
                    var exDate = new Date();
                    exDate.setTime(exDate.getTime() - 1);
                    var read_val = this.read(key);
                    if (read_val != null) document.cookie = key + "=" + read_val + ";expires=" + exDate.toGMTString();
                }
            }
};
3. 时间格式转换

使用方法:

var str = '2017-08-07';
alert(timeFormatConversion({str:str,link:'.',content:'-'}));//2017.8.7
//str为要转换的时间格式,link为要以“神马东西”连接,content原来是“用啥”连接的

源码:

function timeFormatConversion(oldTimeFormat){
   var reg = new RegExp('(\\d+)('+ oldTimeFormat.content +')','g');
   return (oldTimeFormat.str).replace(reg,function($0,$1,$2){
            //第一个参数:$0(匹配成功后的整体结果:2017- ,08-);
            //第二个参数:$1(匹配成功的第一个分组,这里指的是“\d”:2017,08);
            //第三个参数:$2(匹配成功的第二个分组,这里指的是“-”:- , -)
             return $1 + oldTimeFormat.link;
          });
}
        

补充:在正则中使用变量

//方法一:使用eval
var regk = "/(\\d+)("+ bbb +")/g";
ar reg = eval(regk);
//方法二:使用new RegExp();  推荐
var reg = new RegExp('(\\d+)('+ bbb  +')','g');
4. 敏感词过滤

使用方法:

var str2 = "我爱北京天安门, 天安门上太阳升, 伟大领袖毛主席, 指引我们向前进."
document.write(sensitiveWords({str:str2,words:['我','北京','天安门']}));
//str后面是元字符串,words后面是一个数组把要屏蔽的关键字写入。
//注:默认是一个字替换一个*

源码:

function sensitiveWords(sensitive){
    var regWords = '';
    var wordsLength = (sensitive.words).length;//2
    for(var i=0;i<wordsLength;i++){
        if(i == (wordsLength-1)){
            regWords += (sensitive.words)[i];
        }else {
            regWords += (sensitive.words[i]) + '|';
        }
    }
    var reg = new RegExp(regWords,'g');
    return (sensitive.str).replace(reg,function(str){
         var result = '';
        for(var i=0;i<str.length;i++){
            result += '*';
        }
        return result ;
    });
};
5、时间戳转成日期对象

简述:

toLocaleString() 方法可根据本地时间把 Date 对象转换为字符串,并返回结果;
replace(/:\d{1,2}$/,' ')验证替换以:开始有一位或二位数字的结束字符串,就是秒;替换为空。

使用方法:

alert(getLocalTime(1502166609)); //2017-8-8 12:30  单位是秒

源码:

// 单位是秒,传入的时间戳是“秒”数
function getLocalTime(S) {     
   return new Date(parseInt(S) * 1000).toLocaleString().replace(/:\d{1,2}$/,' ');     
}
6、vue-resource跨域取数据

使用方法:

this.$http.jsonp(
      'http://api.k780.com/?app=life.time&appkey={xxxx}&sign={xxxx}&format=json&jsoncallback=data',
      {
        credentials: true,
        jsonp: 'callback',
        jsonpCallback: 'data'
      })
    .then((res) => {
      if (res.data.success === '1') {
        console.log(res.data.result.timestamp)
      }
    }, (err) => {
      console.log('错误了:' + err)
    })
7、判断设备类型

使用方法:

   const browser = browserRedirect();

源码:

 function browserRedirect() {
        const userAgentInfo = navigator.userAgent
        let Agents = ['Android', 'iPhone', 'SymbianOS', 'Windows Phone', 'iPad', 'iPod', 'Mobile']
        let flag = true
        for (let v = 0; v < Agents.length; v++) {
            if (userAgentInfo.indexOf(Agents[v]) > 0) {
                flag = false
                break
            }
        }
        return flag ? 'pc' : 'phone'
    }
8、JS获取浏览器地址栏“指定”数据

使用方法:

  const xxx= GetQueryString("xxx");

源码:

function GetQueryString(name){
    var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if(r!=null)return  unescape(r[2]); return null;
}

function getParameterByName(name) {
        name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
        var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
        return results == null ? "": decodeURIComponent(results[1]);
        }
9、form表单方式请求数据

源码:

        var form = new FormData();
        form.append("键","值");
        var req = new XMLHttpRequest();
        req.open("post", "接口地址", false);
        req.send(form);
        if(req.status>=200 && req.status<300 || req.status==304){
            console.log(req.responseText)
        }
10、ajax数据加密

github地址
使用方法:

1. 加密处理
Base64.encode(str)

2. 解密处理
Base64.decode(str)
11、vue-cli中解决移动端300ms延迟问题(fastclick)

使用方法:

1. 安装
  npm install fastclick --save
2. 使用
  在main.js中引入
  import faskclick from 'fastclick'
  fastclick.attach(document.body)
12、vue中Json数据排序

使用方法:

在计算属性(computed)中进行对数组排序:

sortData: function() {
    return sortByKey(this.data, 'age')
}

源码:

function sortByKey(array, key) {
    return array.sort(function(a, b) {
        var x = a[key];
        var y = b[key];
        return ((x<y)?-1:((x>y)?1:0));
    });
}
13、时间戳转换制定格式“时间”

使用方法:

format(new Date(),'yyyy-MM-dd HH:mm')
"2017-10-10 20:11"
format(new Date(),'yyyy-MM-dd EE')
"2017-10-10 周二"
format(new Date(),'yyyy-MM-dd EEE')
"2017-10-10 星期二"

源码:

let format = (date, fmt) => {
    let o = {
        'M+': date.getMonth() + 1,
        'd+': date.getDate(),
        'h+': date.getHours() % 12 == 0 ? 12 : date.getHours() % 12,
        'H+': date.getHours(),
        'm+': date.getMinutes(),
        's+': date.getSeconds(),
        'q+': Math.floor((date.getMonth() + 3) / 3),//季度
        'S': date.getMilliseconds()
    };
    let week = ['日', '一', '二', '三', '四', '五', '六'];
    if(/(y+)/.test(fmt)) {
        let $1 = RegExp.$1;
        fmt = fmt.replace($1, (date.getFullYear() + '').substr(4 - $1.length));
    }
    if(/(E+)/.test(fmt)) {
        let $1 = RegExp.$1;
        fmt = fmt.replace($1, (($1.length > 1) ? ($1.length > 2 ? '星期' : '周') : '') + week[date.getDay()]);
    }
    for(let k in o) {
        if(new RegExp('(' + k + ')').test(fmt)) {
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)));
        }
    }
    return fmt;
}
14、hasOwnProperty() 函数详解

使用方法:

let json = {"a": 1, "b": 2, "c": 3}
json.hasOwnProperty("a")  => 存在返回 ture
json.hasOwnProperty("d")  => 不存在返回 false
15、字节个数统计

使用方法:

var str = '123axc我是好人';
 alert(getByLen(str));

源码:

      function getByLen(str,type){
            var len = 0;
            for (var i=0;i<str.length;i++){
                if(str.charAt(i)>='\u4e00' && str.charAt(i)<='\u9fa5'){
                    if(type == 'gbk' || type == 'gb2312'){
                        len+=2;
                    } else {
                        len+=3;
                    }
                } else {
                    len++;
                }
            }
            return len;
        }
16、千分位

源码:

 function formatCurrency(num) 
        {
            if(num)
            {
                //将num中的$,去掉,将num变成一个纯粹的数据格式字符串
                num = num.toString().replace(/\$|\,/g,'');
                //如果num不是数字,则将num置0,并返回
                if(''==num || isNaN(num)){return 'Not a Number ! ';}
                //如果num是负数,则获取她的符号
                var sign = num.indexOf("-")> 0 ? '-' : '';
                //如果存在小数点,则获取数字的小数部分
                var cents = num.indexOf(".")> 0 ? num.substr(num.indexOf(".")) : '';
                cents = cents.length>1 ? cents : '' ;//注意:这里如果是使用change方法不断的调用,小数是输入不了的
                //获取数字的整数数部分
                num = num.indexOf(".")>0 ? num.substring(0,(num.indexOf("."))) : num ;
                //如果没有小数点,整数部分不能以0开头
                if('' == cents){ if(num.length>1 && '0' == num.substr(0,1)){return 'Not a Number ! ';}}
                //如果有小数点,且整数的部分的长度大于1,则整数部分不能以0开头
                else{if(num.length>1 && '0' == num.substr(0,1)){return 'Not a Number ! ';}}
                //针对整数部分进行格式化处理,这是此方法的核心,也是稍难理解的一个地方,逆向的来思考或者采用简单的事例来实现就容易多了
                /*
                  也可以这样想象,现在有一串数字字符串在你面前,如果让你给他家千分位的逗号的话,你是怎么来思考和操作的?
                  字符串长度为0/1/2/3时都不用添加
                  字符串长度大于3的时候,从右往左数,有三位字符就加一个逗号,然后继续往前数,直到不到往前数少于三位字符为止
                 */
                for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
                {
                    num = num.substring(0,num.length-(4*i+3))+','+num.substring(num.length-(4*i+3));
                }
                //将数据(符号、整数部分、小数部分)整体组合返回
                return (sign + num + cents);    
            }

        }



阅读更多
想对作者说点什么? 我来说一句

学生宿舍管理系统(c语言)

2009年10月20日 3KB 下载

oracle 常用函数

2010年01月08日 15KB 下载

SQL常用命令使用方法

2008年04月09日 51KB 下载

完整的五金店商品管理系统

2010年05月16日 8KB 下载

没有更多推荐了,返回首页

不良信息举报

函数记录

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭