zoukankan      html  css  js  c++  java
  • JavaScript一些常用方法一

    整理以前的笔记,在学习JavaScript时候,经常会用到一些方法,但是有时忘掉了具体用法,因此记下。方便以后查阅。
    

    这篇博文先说明这些方法的用途:
    splice()、push()、pop() 、shift()、unshift()、hasOwnProperty() 、match() 、map() 、reduce()、filter()

    一、 .splice()

    通过删除现有元素和/或添加新元素来更改数组的内容
    例如:

    var myFish = ["angel", "clown", "mandarin", "surgeon"];
    //从第 2 位开始删除 0 个元素,插入 "drum"
    var removed = myFish.splice(2, 0, "drum");
    //运算后的 myFish:["angel", "clown", "drum", "mandarin", "surgeon"]
    //被删除元素数组:[],没有元素被删除
    console.log("1:"+removed+"---"+myFish); //1:---angel,clown,drum,mandarin,surgeon
    //从第 3 位开始删除 1 个元素
    removed = myFish.splice(3, 1);
    //运算后的myFish:["angel", "clown", "drum", "surgeon"]
    //被删除元素数组:["mandarin"]
    console.log("2:"+removed+"---"+myFish); //2:mandarin---angel,clown,drum,surgeon
    //从第 2 位开始删除 1 个元素,然后插入 "trumpet"
    removed = myFish.splice(2, 1, "trumpet");
    //运算后的myFish: ["angel", "clown", "trumpet", "surgeon"]
    //被删除元素数组:["drum"]
    console.log("3:"+removed+"---"+myFish);//3:drum---angel,clown,trumpet,surgeon
    //从第 0 位开始删除 2 个元素,然后插入 "parrot", "anemone""blue"
    removed = myFish.splice(0, 2, "parrot", "anemone", "blue");
    //运算后的myFish:["parrot", "anemone", "blue", "trumpet", "surgeon"]
    //被删除元素的数组:["angel", "clown"]
    console.log("4:"+removed+"---"+myFish);//4:angel,clown---parrot,anemone,blue,trumpet,surgeon
    //从第 3 位开始删除 2 个元素
    removed = myFish.splice(3, Number.MAX_VALUE);
    //运算后的myFish: ["parrot", "anemone", "blue"]
    //被删除元素的数组:["trumpet", "surgeon"]
    console.log("5:"+removed+"---"+myFish);//5:trumpet,surgeon---parrot,anemone,blue

    二、.push()

    一个或多个参数添加到数组末尾
    例如:

    var arr = [1,2,3]; 
    arr.push(4); // 现在arr的值为 [1,2,3,4]

    三、.pop()

    “抛出”一个数组末尾的值
    例如:

    var arr=[1, 4, 6]
    var oneDown = arr.pop();//现在 oneDown 的值为 6 ,arr变成了 [1, 4]
    

    四、.shift()

    “移出”一个数组的第一个并赋值
    例如:

    var arr=[1, 4, 6]
    var oneDown = arr.shift();//现在 oneDown 的值为 1 ,arr变成了 [4, 6]

    五、.unshift()

    头部添加元素
    例如:

    var arr = [1,2,3]; 
    arr.unshift(4); // 现在arr的值为 [4,1,2,3]

    六、.hasOwnProperty()

    检查对象是否有该属性
    例如:

    var myObj = {
          top: "hat",
          bottom: "pants"
        };
    myObj.hasOwnProperty("top");    // true
    myObj.hasOwnProperty("middle"); // false

    七、 .match()

    匹配字符使用
    例如:

       var testString = "Hello World! How are you!Haha";  //定义一个字符串
    
    //设置要查找的格式 
    /*   / 是这个正则表达式的头部
     h 是我们想要匹配的模式
     / 是这个正则表达式的尾部
    g 代表着 global(全局),意味着返回所有的匹配而不仅仅是第一个。
    i 代表着忽略大小写,意思是当我们寻找匹配的字符串的时候忽略掉字母的大小写。
    */
    var expressionToGetSoftware = /h/gi;    
    var softwareCount = testString.match(expressionToGetSoftware).length;//softwareCount为4

    八、 .map()

    迭代数组
    例如:

    var oldArray = [1,2,3,4,5];
    var newArray = oldArray.map(function(val){
      return val+3;
    });
     console.log(newArray);  //[4, 5, 6, 7, 8]

    九、 .reduce()

    迭代一个数组,并且把它累积到一个值中
    例如:

    var array = [4,5,6,7,8];
    var singleVal = 0;
    // 累加器 和当前值
    singleVal = array.reduce(function(qq,ww){
        console.log("qq:"+qq+",ww:"+ww); //qq:4,ww:5  qq:9,ww:6 qq:15,ww:7 qq:22,ww:8
      return qq+ww;
    });
    console.log(singleVal); //30

    十、 .filter()

    迭代一个数组,并且按给出的条件过滤出符合的元素
    例如:

    var oldArray = [1,2,3,4,5,6,7,8,9,10];
    var newArray = oldArray.filter (function(val){
      return val<6;            //保留小于6的数据
    });
    console.log(newArray);  //[1, 2, 3, 4, 5]
    
    //删除数组中的所有假值。在JavaScript中,假值有false、null、0、""、undefined 和 NaN。
    //通过filter方法来过滤掉假值
    function bouncer(arr) {
       var newarr=arr.filter(function(val){
        return !!val;
       });
      return newarr;
    }
    //判断是否是真值,如果不是就过滤掉
    function bouncer(arr) {
      return arr.filter(Boolean);
    }
    
    console.log(bouncer([7, "ate", "", false, 9])); //[7, "ate", 9]
    console.log(bouncer([false, null, 0, NaN, undefined, ""])); //[]
    console.log(bouncer([1, null, NaN, 2, undefined]));  // [1, 2]
  • 相关阅读:
    dotnet 控制台读写 Sqlite 提示 no such table 找不到文件
    dotnet 控制台读写 Sqlite 提示 no such table 找不到文件
    dotnet 控制台 Hangfire 后台定时任务
    dotnet 控制台 Hangfire 后台定时任务
    dotnet 获取指定进程的输入命令行
    dotnet 获取指定进程的输入命令行
    PHP sqrt() 函数
    PHP sinh() 函数
    PHP sin() 函数
    PHP round() 函数
  • 原文地址:https://www.cnblogs.com/xuwujing/p/7536721.html
Copyright © 2011-2022 走看看