zoukankan      html  css  js  c++  java
  • 开动大脑js小案例(有空就更新的那种)

    1、数组去重(数组去重有n种方法实现,达到目的才是王道)

      (1)、利用indexof去重,但是ie8有兼容问题

        let arr = [1,2,5,4,2,5,8,4,52,4,5,4,2,5,4];

        let arr1 = [];

        for(let i = 0 ; i < arr.length; i++){

          if( arr1.indexOf(arr[i]) < 0 ){

            arr1.push( arr[i] );

          }

        }

        console.log(arr1);

      (2)、遍历去重

      let arr = [1,2,1,2,1,5,1,2,4] ;

      let arr1 = [];

      for(let i = 0; i<arr.length;i++ ){

        for(let j = j+1; j <arr.length;j++){

          if(arr[i] === arr[j]){

            i++;

            j = i;

          }

        }

        arr1.push(arr[i]);

      } 

      console.log(arr1);

    2、判断一个字符串中出现最多的字符

      let str = ‘aagggggggggyyyyyhhhbbeeevvxx’;

      let obj = {};

      let maxNum = 0;

      let maxStr = '' ;

      for( let i = 0; i < str.length; i++){

        if( obj[str.charAt(i)] ){

          obj[ str.charAt( i ) ] ++

        }else{

          obj[ str.charAt( i ) ]  = 1

        }

      }

      for( x in obj ){

        if( obj[x] > maxNum  ){

          maxStr = x;

        }

      }

      console.log('出现最多次数的字符为'+maxStr);

     3、js根据成绩排序倒序(从大到小),成绩相同的根据选号排序正序(从小到大);

      let roster = [
    {name:'司马光',scope:85,code:201401},
    {name:'刘邦',scope:60,code:201402},
    {name:'拿破仑',scope:96,code:201403},
    {name:'雍正',scope:85,code:201404},
    {name:'努尔哈赤',scope:66,code:201405},
    ];

    // 排序
    function rosterSort(x,y){
    if (x.scope > y.scope){
    return -1
    } else if(x.scope < y.scope){
    return 1
    }else {
    // 成绩相同的时候按学号倒序
    if(x.code < y.code){
    return -1
    }else{
    return 1
    }
    }
    }
    let arrSort = roster.sort(rosterSort);

    console.log(arrSort);

     4、判断字符中是否含有手机号

      let str = '离别没说再见13522455555你是否心酸5522转身寥寥笑脸不63323甘的甘愿也许下个冬天也许还十年5522';
      let newStr = str.replace(/[^0-9]/ig," ");
      newStr = newStr.split(' ');
      for(let i = 0; i<newStr.length;i++){
        if(/^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])d{8}$/.test(newStr[i])){
          console.log('含有手机号')
        }else{

          conosle.log('不含有手机号')

        }
      }

    5、经典面试题展示

    // 方式1:一个构造函数嘛,里面有个全部变量getName 指向一个匿名函数(小心闭包)
    function Foo() {
    getName = function () {
    console.log (1);
    };
    return this;
    }
    // 方式2:构造函数的一个属性getName 指向一个匿名函数
    Foo.getName = function () {console.log (2);};
    // 方式3:构造函数的原型上有个getName方法
    Foo.prototype.getName = function () {console.log('baidu' && 'google');};
    // 方式4:定义一个变量指针指向一个匿名函数
    var getName = function () { console.log (4);};
    // 方式5:声明一个叫getName的有名函数
    function getName() {console.log (5);}

    //输出结果
    Foo.getName(); // 2
    getName(); // 4
    Foo().getName(); // 1
    getName(); // 1
    new Foo.getName(); // 2
    new Foo().getName(); // google
    new new Foo().getName(); // google

    // 每块函数的意义都清楚了吧,接下来再分析执行语句的代码:
    // >>执行语句第一行: Foo.getName()
    // 此句应该没什么要说的吧,就是调用方式2的函数代码块,结果为“2”!
    // >>执行语句第二行:getName()
    // 如果单独看这条执行语句,一般会有个全局声明的函数方式5"function getName(){} ",但要是放在这么个复杂的上下文环境中,
    // 那肯定是不一样的啦,因为还有个方式4 “var getName = function(){}” 来捣乱,这就要考察一个知识点(你妈和你媳妇掉水里,
    // 你救谁的问题?nonono,可没那么纠结),当定义的变量和声明的函数重名了怎么办?答:它们都会进行预解析,函数声明提前于变量声明,
    // 但是最终会被变量覆盖!so方式4获胜,输出结果为“4”!
    // >>执行语句第三行:Foo().getName()
    // 本句,有个执行顺序的,先执行方式1的“Foo()”,结果是"this" 并指向window,并产生了一个全局getName(window.getName)指针指向一个匿名函数
    // ,然后再执行"this.getName()" , 其实就是执行刚刚造出来的那个全局getName指向的匿名函数,所以输出“1”.
    // >>执行语句第四行:getName()
    // 此句执行的是方式1执行出来的那个全局变量getName 指针指向的匿名函数,有人问为啥不执行方式4?俺想说方式4已经被覆盖了!所以结果为 “1”.
    // >>执行语句第五行:new Foo.getName()
    // 首先还是先看运算符优先级吧,我自个看完的结果是【new Foo() >  Foo() > new Foo】,先运算方式2的Foo.getName() 结果为“2”,再new一个Foo实例对象。
    // >>执行语句第六行:new Foo().getName()
    // 先执行 new Foo(), 结果产生一个新的实例对象,并且继承了Foo()这个构造函数中的getName方法,所以再执行方式3函数块,而接着有涉及到另一个知识点:逻辑运算符运算,
    // 对于 “&&”来说,如果前者为真,那么就去执行后者,否则只执行前者; 对于“||”来说,如果前者为真,只执行前者,后者不必执行,否则还得执行后者。因此结果为 “google”。
    // >>执行语句第七行:new new Foo().getName()
    // 先执行new Foo(),变成了 new Foo的实例对象.getName(), 然后再执行 Foo的实例对象.getName(),又回到了方式3函数块,结果为“google”,最后执行new Foo的实例对象。
    --------------------- 原文:https://blog.csdn.net/mongo__/article/details/72810338 


    6、筛选出两个数组不相同的元素

         let a = [{ name: 'javascript', id: 0 }, { name: 'css', id: 1 }, { name: 'html', id: 2 }]
        let b = [{ name: 'css', id: 1 }, { name: 'html', id: 2 }]
        let n = [];
        for (let i = 0; i < a.length; i++) { 
          let staA = a[i].id;
          let sta = 0;
          for(let j = 0; j < b.length; j++){
            let staB = b[j].id;
            if (staA == staB){
              sta++
            }
          }
          if (sta == 0){
            n.push(a[i])
          }
        }
        console.log(n)
    

      




  • 相关阅读:
    解读express框架
    mongodb学习
    Express框架
    如何添加第三方路由进度条?
    商品删除、添加login和register组件
    商品编辑实操(上文三种方法验证)
    实现添加商品页面,并且构建路由
    与json-server对接,为组件提供CRUD API功能
    json-server学习
    jQuery核心
  • 原文地址:https://www.cnblogs.com/zshno1/p/10466213.html
Copyright © 2011-2022 走看看