zoukankan      html  css  js  c++  java
  • 【javascript】 js/jquery 常用代码和实践

    1.获取某天后几天的日期

    //d为传入的日期  days为d后面的几天
    function getAfterDate(d,days){
      var
    dd = new Date(d);   dd.setDate(dd.getDate()+days);   var y = dd.getFullYear();   var m = dd.getMonth()+1;   var d = dd.getDate();   return y+"-"+m+"-"+d;
    }
    alert(getAfterDate('2019-02-28',1)) //打印出2019-03-01

    2.检测浏览器是否支持canvas

    function isSupportCanvas() {
            return document.createElement('canvas').getContext ? true : false;
    }
    // 测试
    alert(isSupportCanvas());  //true

     3.根据日期计算年龄

    function getAge(dateString) {
            var today = new Date();
            var birthDate = new Date(dateString);
            var todayDateYear = today.getFullYear();
            var birthDateYear = birthDate.getFullYear();
            var age = todayDateYear - birthDateYear;
            var m = today.getMonth() - birthDate.getMonth();
            if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate())) {
                age--;
            }
            return age;
    }

     4.求两个有序数组的交集

    function arrayIntersection(a, b){
            var a_index=0, b_index=0;
            var result = new Array();
    
            while( a_index < a.length && b_index < b.length )
            {
                if (a[a_index] < b[b_index] )  {
                    a_index++;
                } else if (a[a_index] > b[b_index] ) {
                    b_index++;
                } else {
                    //相等
                    result.push(a[a_index]);
                    a_index++;
                    b_index++;
                }
            }
            return result;
    }
    alert(arrayIntersection([1,2,3],[1,3,4,5,6,9]));//[1,3]

    5.根据后端返回的值 选中select

    $("#select_id option[value='"+后端返回的值+"']").attr("selected","selected");

    6.获取数组中的键

    var arr = ["aa", "bb", "cc", "dd"];
    var keys_arr = arr.keys(); //[object Array Iterator]

     7.数组合并

    var arr1 = [ 1, 2, 3, 4, 5 ];
    var arr2 = [ "aa", "bb", "cc"];
    var arr3 = arr1.concat(arr2);    //concat不会去除重复的值

    8.去重数组的值

    function uniqueArr(array) {
        var r = [];
        //alert(array.length);  9
        for (var i = 0, l = array.length; i < l; i++) {
            for (var j = i + 1; j < l; j++){
                //j = i++;    j=0
                //j = ++i;    j=1
                if (array[i] === array[j]) {
                    j = ++i;
                }
            }
            r.push(array[i]);
        }
        return r;
    }
    alert(uniqueArr( [1, 2, 3 , '1', 2, '4',3, ,'6']));  //1,1,2,4,3,,6

    9.对象的深拷贝

    function deepCloneObj(initalObj, finalObj) {
        var obj = finalObj || {};
        for (var i in initalObj) {
            var prop = initalObj[i];
            //避免相互引用对象导致死循环,如initalObj.cloumn = initalObj的情况
            if(prop === obj) {
                continue;
            }
            if (typeof prop === 'object') {
                obj[i] = (prop.constructor === Array) ? [] : Object.create(prop);
            } else {
                obj[i] = prop;
            }
        }
        return obj;
    }
    
    var obj = {
        a: {
            a: "aaa",
            b: "bbb"
        }
    }
    var cloneObj = deepCloneObj(obj);
    cloneObj.a.a = "changed";
    alert(cloneObj.a.a);  //changed

    js深拷贝还可以用JSON.stringfy()和JSON.parse()实现  :  JSON.parse(JSON.stringify(obj))  ,jQuery.extend()也实现了对象的深拷贝。

    10.判断对象是否存在该属性

    var map = {
       'key': ''
    };
    alert('key' in map); //true

     11.判断浏览器是否支持map和set

    'use strict';
    var m = new Map();
    var s = new Set();
    alert('该浏览器支持map和set');   //如果不报错输出这句话说明支持

     12.jquery取消绑定事件

    $(document).off("click", "div");

     13.生成范围随机数

    //生成从min到max的随机数
    function randomNum(min,max){ 
        switch(arguments.length){ 
            case 1: 
                return parseInt(Math.random()*min+1,10); 
            break; 
            case 2: 
                return parseInt(Math.random()*(max-min+1)+min,10); 
            break; 
                default: 
                    return 0; 
                break; 
        } 
    } 
    alert(randomNum(12));

    Math.round(Math.random());//获取0到1的随机整数。
    Math.random() 生成 [0,1) 的数,所以 Math.random()*10 生成 {0,10) 的数
    parseInt() 和 Math.floor() 结果都是向下取整,所以要加1

    14.函数柯里化

        柯里化其实将需要多个参数的一个函数转换成一系列函数去执行。举个例子如下:

    function add(a, b) {
        return a + b;
    }
    
    //函数只能传一个参数时候实现加法
    function curry(a) {
        return function(b) {
            return a + b;
        }
    }
    var add2 = curry(5); //add2也就是第一个参数为5的add版本
    alert(add2(5)); //输出8

    可以看看这篇博客 https://github.com/mqyqingfeng/Blog/issues/42

    15.节流 (不管怎么触发,都按照指定的间隔来执行)

    function throttle(func, wait) {
      var timer
      return function() {
        var context = this
        var args = arguments
        if (!timer) {
          timer = setTimeout(function () {
            timer = null
            func.apply(context, args)
          }, wait)
        }
      }
    }

     16.javascript中的LHS与RHS

          LHS(Left-hand Side)引用和RHS(Right-hand Side)引用,表示对变量赋值和取变量值的不同操作方式。

     17.javascript的Event Loop

      JavaScript是单线程,就是同一个时间只能做一件事, JavaScript所有任务任务被分为Task(又称为MacroTask,宏任务)和MicroTask(微任务)两种,都是在两个地方执行:执行栈和任务队列。前者是存放同步任务;后者是异步任务有结果后,就在其中放入一个事件。
      执行顺序:先跑执行栈里的同步任务,然后再跑任务队列的异步任务。

     18.查找一个字符串在另一个字符串中出现了几次

    function countInstances(Str, findStr){
            var count = 0;
            var offset = 0;
            while(offset != -1){
                offset = Str.indexOf(findStr, offset);//返回findStr在Str中首次出现的位置
                if(offset != -1) {
                    count++;
                    offset += findStr.length;
                }
            }
            return count;
     }
     alert(countInstances('aas"a"aasd','aa'));  //2

    19.相对当前域名链接跳转

    self.location.href = '/employee/approval/Salary/myApprovalIndex'

     20.调用浏览器打印

    window.print();

     21.去除字符串换行

    function formatStr(str){
           return str.replace(/[
    ]/g,"");
    }
  • 相关阅读:
    用MFC(C++)实现拼音搜索
    MFC里ON_COMMAND_RANGE消息映射的ID问题
    01:MFC应用程序编程
    MFC笔记(DN)
    linuxmint系统定制与配置(2)-输入法
    linuxmint系统定制与配置(3)-字体
    linuxmint系统定制与配置(1)-系统初始配置
    笔记-读官方Git教程(2)~安装与配置
    笔记-读官方Git教程(1)~认识Git
    Python中多层List展平为一层
  • 原文地址:https://www.cnblogs.com/songgj/p/10722718.html
Copyright © 2011-2022 走看看