美文网首页
数组、字符串、数学函数

数组、字符串、数学函数

作者: 饥人谷区子铭 | 来源:发表于2016-09-30 19:19 被阅读0次

    一、数组方法里push、pop、shift、unshift、join、split分别是什么作用。


    (1).arr.push()用于向数组的末尾新添加一个或者多个元素,本身会返回新数组的长度

    var arr = [1,2,3]
    arr.push(4,5)
    console.log(arr)  //[1,2,3,4,5]
    console.log(arr.length)  //  7
    console.log(arr.push(6,7))  //7    本身返回arr.length
    
    arr.push('str')
    console.log(arr)  //[1, 2, 3, 4, 5, 6, 7, "str"]
    
    arr.push([1,2,3])  
    console.log(arr)   //[1, 2, 3, 4, 5, 6, 7, "str", [1, 2, 3]]
    
    arr.push(['a','b'])
    console.log(arr)  // [1, 2, 3, 4, 5, 6, 7, "str", [1, 2, 3], ["a", "b"]]
    
    arr.push([c,d,e])
    console.log(arr)  //报错
    

    (2).arr.unshift()用于在数组前开头新添一个或者多个元素,也会返回新数组的长度;

    var arr = [3,4,5]
    arr.unshift(2)
    console.log(arr)//[2, 3, 4, 5]
    console.log(arr.length)  //4
    console.log(arr.unshift(2))  //4  返回arr.length
    
    arr.unshift(-1,0,1)
    console.log(arr)  //[-1, 0, 1, 2, 3, 4, 5]
    
    arr.unshift([-3,-2])
    console.log(arr)  //[[-3, -2], -1, 0, 1, 2, 3, 4, 5]
    
    arr.unshift  //(['hi','hello'])
    console.log(arr)  //[["hi", "hello"], [-3, -2], -1, 0, 1, 2, 3, 4, 5]
    

    (3).arr.pop()用于删除数组最后一位元素,并返回删除的值;

    var arr = [1,2,3] 
    console.log(arr.pop()) //删了最位一位,返回删除的值3
    console.log(arr)  //[1, 2]
    console.log(arr.pop()) //返回删除的值2
    console.log(arr.length) //剩余长度1
    

    (4)arr.shift()用于删除数组第一位元素,并返回删除的值;

    var a = [1,2,3,4];
    a.shift();            //返回删除的值 1;
    console.log(a);     //  a = [2,3,4]
    console.log(a.length);  //  3
    

    (5)arr.join()方法——把数组变成字符串
    连接数组中的元素,有且只返回一个字符串,多用于给变量赋值;
    通过传入的分隔符进行分隔的,分隔符可以是空格,横线等;
    如果()括号里不传参数,则默认以逗号,作为分割
    注意:无论传参后结果如何,都不会修改原数组内容

    var a = [1,2,3,4];
    console.log(a.join());// 不填写参数时默认逗号作为连接符 "1,2,3,4"
    console.log(a) // 依然是[1,2,3,4]
    
    console.log(a.join("")); //参数为空字符串时输出  "1234"
    console.log(a.join(" "))  //参数时空格字符串时输出 "1 2 3 4"
    console.log(a.join("-"));  // "1-2-3-4"
    console.log(a.join("@"))  //"1@2@3@4"
    console.log(typeof a);  //  object
    console.log(a);       // [1,2,3,4] 不会修改原数组内容
    

    (6)str.split()方法——把字符串变成数组
    split()与join()正好相反,可以把字符串分割成数组,而且也不会更改字符串本身,只是输出值传递给变量。
    如果不传入参数,那么它会把字符串完整的转换为数组,并且数组的长度为1.
    如果传入了参数(一般以逗号或者字符串中出现的字符分割)就以该参数分割数组。
    留意:这两个参数,第一个参数作为分隔作用来分隔元素,第二个是分割出来的数组项个数。

    var str = "1a2b3c4d"
    console.log(str.split())//默认不传参["1a2b3c4d"]
    console.log(str.split("")) //参数为空字符串时输出["1", "a", "2", "b", "3", "c", "4", "d"]
    console.log(str.split(" "))//参数时空格字符串时输出["1a2b3c4d"]
    console.log(str.split("",2))//分割出来的数组项的前2个["1", "a"]
    console.log(str.split("",4))//分割出来的数组项的前4个["1", "a", "2", "b"]
    console.log(str.split(","))//因为原字符串无逗号,所以以逗号分割也无效
    console.log(str.split("-"))//因为原字符串-逗号,所以以-分割也无效
    console.log(str)  //依然是"1,2,3,4" 
    console.log(typeof str);//"string"
    
    var str2 = "1:2:3:4" 
    console.log(str2.split(':'))//["1", "2", "3", "4"]
    
    var str3 = "1|2|3|4"
    console.log(str3.split('|'))//["1", "2", "3", "4"]
    

    (7)arr.reverse()颠倒数组中元素的顺序,修改并返回改变后的数组。

    var arr = [1,2,3]
    arrr.reverse()//[3,2,1]
    console.log(arr)//[3,2,1]
    

    (8)arr.sort()数组排序,修改并返回改变后的数组。
    sort()是接受一个比较函数,用这个函数来判断大小,结果是字符的排序,不是数字大小的排序

    var arr = [1,-2,3,-4]
    arr.sort()  //[-2, -4, 1, 3]
    console.log(arr)  //[-2, -4, 1, 3]
    

    二、代码题

    1.数组

    • 用 splice 实现 push、pop、shift、unshift方法

    arr.splice()给数组添加或者删除元素,同时修改着原数组
    splice作用:用于数组的删除/插入/替换
    splice()方法始终都会返回一个数组
    splice(开始下标,删除个数,插入元素(可以是多个))

    //splice(开始下标,删除个数,插入元素(可以是多个))
    var arr = [1,2,3,4]
    arr.splice(1,2);  //[2,3]
    console.log(arr)  //[1,4]
    var arr2 = [1,2,3,4]
    arr2.splice(1,2,'a','b','c') //[2,3]
    console.log(arr)  //[1,'a','b','c',4]
    

    • 用splice 实现 push方法,末位添元素
    var a = [1,2,3]
    function push(arr,val){
        arr.splice(arr.length,0,val)
        return arr.length
    }
    push(a,1)//4
    console.log(a)//[1, 2, 3, 1]
    

    • 用splice 实现pop方法,删末位元素
    var a = [1,2,3]
    function pop(arr){
        arr.splice(arr.length-1,1)
        return arr.length
    }
    pop(a)//2
    console.log(a)//[1, 2]
    pop(a)//1
    console.log(a)//[1]
    

    • 用splice实现shift方法,删首位元素
    var a = [1,2,3]
    function shift(arr){
        arr.splice(0,1)
        return arr.length
    }
    shift(a)//2
    console.log(a)//[2,3]
    shift(a)//1
    console.log(a)//[3]
    

    • 用splice实现unshift方法,首位添元素
    var a = [3,4,5]
    function unshift(arr,val){
        arr.splice(0,0,val)
        return arr.length
    }
    unshift(a,2)//4
    console.log(a)//[2, 3, 4, 5]
    unshift(a,1)//5
    console.log(a)//[1, 2, 3, 4, 5]
    

    • 使用数组拼接出如下字符串

    题目:
    var prod = { 
          name: '女装', 
          styles: ['短款', '冬季', '春装']
    };
    function getTpl(data){ 
          //todo...
    };
    var result = getTplStr(prod); //result为下面的字符串
    <dl class="product"> 
          <dt>女装</dt> 
          <dd>短款</dd> 
          <dd>冬季</dd> 
          <dd>春装</dd>
    </dl>
    

    方法一:先数组后转字符串


    字符串拼接1.png

    方法二:直接拼接字符


    拼接字符串2.png

    • 写一个find函数,实现下面的功能

    题目:
    var arr = [ "test", 2, 1.5, false ]
    find(arr, "test") // 0
    find(arr, 2) // 1
    find(arr, 0) // -1
    
    答题:
    //兼容写法
    function find(arr,val){
        if(arr.indexOf){
           return arr.indexOf(val)
        }
        for(var i=0;i<arr.length;i++){
            if(arr[i] === val){
               return i
            } 
        }
        return -1
    }
    console.log(find(arr, "test"))//0
    console.log(find(arr, 2))//1
    console.log(find(arr, 0))//-1
    
    88.png
    • 写一个函数filterNumeric,把数组 arr 中的数字过滤出来赋值给新数组newarr, 原数组arr不变。

    题目:
    arr = ["a", "b", 1, 3, 5, "b", 2];
    newarr = filterNumeric(arr); // [1,3,5,2]
    
    模拟过滤器
    方法一:用新数组
    arr = ["a", "b", 1, 3, 5, "b", 2];
    console.log(filterNumeric(arr)); // [1,3,5,2]
    function filterNumeric(arr){
        var newArr = [];
        for(var i=0;i<arr.length;i++){
           if(typeof arr[i] === "number"){
               newArr.push(arr[i])        
            } 
        }  
        return newArr
    }
    方法二:若要用原数组
    arr = ["a", "b", 1, 3, 5, "b", 2];
    console.log(filterNumeric(arr)); // [1,3,5,2]
    function filterNumeric(arr){
        for(var i=arr.length-1;i>=0;i--){
            if(typeof arr[i] !== "number"){
               arr.splice(i,1)        
             } 
        }  
        return arr
    }
    

    • 对象obj有个className属性,里面的值为的是空格分割的字符串(和html元素的class特性类似),写addClass、removeClass函数,有如下功能

    题目:
    var obj = { 
        className: 'open menu'
    }
    addClass(obj, 'new') // obj.className='open menu new'
    addClass(obj, 'open') // 因为open已经存在,所以不会再次添加open
    addClass(obj, 'me') // me不存在,所以 obj.className变为'open menu new me'
    console.log(obj.className) // "open menu new me"
    removeClass(obj, 'open') // 去掉obj.className里面的 open,变成'menu new me'
    removeClass(obj, 'blabla') // 因为blabla不存在,所以此操作无任何影响
    

    addClass方法一:


    addClass(1).png

    addClass方法二:


    addClass(2).png
    addClass方法三:
    addClass(3).png

    removeClass方法一:


    removeClass(1).png
    removeClass规范答案
    function removeClass(obj, cls) { 
          var classArr = obj.className.split(' '); 
          for (var i = 0; i < classArr.length; i++) { 
            if (cls === classArr[i]) { 
                classArr.splice(i, 1);
                i--; //这个没注意到
              }
           } 
           obj.className = classArr.join(' '); 
    }
    

    • 写一个camelize函数,把my-short-string形式的字符串转化成myShortString形式的字符串,如

    题目:
    camelize("background-color") == 'backgroundColor'
    camelize("list-style-image") == 'listStyleImage'
    

    解答


    切割器.png

    • 如下代码输出什么?为什么?

    题目:
    arr = ["a", "b"];
    arr.push( function() { alert(console.log('hello hunger valley')) } );
    arr[arr.length-1]() // ?
    

    结果


    结果.png

    分析:控制台打印出hello hunger valley,alert框弹出undefined。为什么是这个结果呢?
    (1)push( function() { alert(console.log('hello hunger valley')) } );就是push一个匿名函数放到了数组arr的最后一项
    (2)arr = ["a","b",function() { alert(console.log('hello hunger valley')) }]
    (3)arr[arr.length-1]() 加括号变成了立即执行函数
    (4)所以控制台打出 hello hunger valley,也正因为console.log只在控制台输出,并不返回值,所以报undefind。
    (5)经测试发现平常写alert(console.log())也会弹出undefined,所以弹框结果如此


    • 写一个函数filterNumericInPlace,过滤数组中的数字,删除非数字。要求在原数组上操作

    题目:
    arr = ["a", "b", 1, 3, 4, 5, "b", 2];//对原数组进行操作,不需要返回值
    filterNumericInPlace(arr);
    console.log(arr) // [1,3,4,5,2]
    
    解题
    function filterNumericInPlace(arr){
        for(var i=0;i<arr.length;i++){
          if(typeof arr[i]!== "number"){
             console.log( arr.splice(i,1))
              i--
            }
        }
    }
    filterNumericInPlace(arr);
    console.log(arr)   //[1,3,4,5,2]
    重点是i--,因为循环第一遍,如果typeof arr[0]≠number,i=i+1,
    导致检测b是无法被取出,过程是0→匹配对→再i--变成负1→再i++→i重回0,所以需要i-- ,回到原始位置,再进行条件判断
    
    filter.png

    • 写一个ageSort函数实现数组中对象按age从小到大排序

    题目:
    var john = { name: "John Smith", age: 23 }
    var mary = { name: "Mary Key", age: 18 }
    var bob = { name: "Bob-small", age: 6 }
    var people = [ john, mary, bob ]
    ageSort(people) // [ bob, mary, john ]
    
    sort()方法巧妙之处能按需求的那部分来为数组作排序
    var john = { name: "John Smith", age: 23 };
    var mary = { name: "Mary Key", age: 18 };
    var bob = { name: "Bob-small", age: 6 };
    var people = [ john, mary, bob ]; //people本身是数组
    function ageSort(people){
        people.sort(function(v1,v2){
            return v1.age - v2.age;
        });
    }
    console.log(people);// [ bob, mary, john ]
    ageSort(people)
    

    • 写一个filter(arr, func)函数用于过滤数组,接受两个参数,第一个是要处理的数组,第二个参数是回调函数(回调函数遍历接受每一个数组元素,当函数返回true时保留该元素,否则删除该元素)。实现如下功能:

    题目:
    function isNumeric (el){ 
          return typeof el === 'number'; 
    }
    arr = ["a",3,4,true, -1, 2, "b"]
    arr = filter(arr, isNumeric) ; // arr = [3,4,-1, 2], 过滤出数字
    arr = filter(arr, function(val) { 
          return typeof val === "number" && val > 0 
    }); // arr = [3,4,2] 过滤出大于0的整数
    
    //定义函数
    function filter(arr, func) { 
          for (var i = 0; i < arr.length; i++) { 
              if (!func(arr[i])) { //不符合数字的就剔除
                    arr.splice(i, 1);
                    i -= 1; //剔除之后下标减一,否则会跳过删掉的元素的下一元素 
               } 
          } 
          return arr; 
    }
    //回调函数,条件:符合是数字
    function isNumeric (el){   
          return typeof el === 'number'; 
    }
    arr = ["a", -1, 2, "b"]
    arr = filter(arr, isNumeric) ; // arr = [-1, 2], 过滤出数字
    arr = filter(arr, function(val) { return val > 0 }); // arr = [2] 过滤出大于0的整数
    

    三.字符串

    • 写一个 ucFirst 函数,返回第一个字母为大写的字符

    题目:ucFirst("hunger") == "Hunger"
    

    解答:


    substr和substring方法.png

    简单粗暴


    str方法.png

    • 写一个函数truncate(str, maxlength), 如果str的长度大于maxlength,会把str截断到maxlength长,并加上...

    题目:
    truncate("hello, this is hunger valley,", 10)) == "hello, thi...";
    truncate("hello world", 20)) == "hello world"
    

    解题


    QQ截图20160927181922.png

    四.数学函数

    • 写一个函数,获取从min到max之间的随机整数,包括min不包括max

    //过程
    function randomNum(min,max){
          var num = Math.floor(Math.random()*(max-min))
          console.log(min+num)
    }
    randomNum(6,10)// 输出68998998789787868  
    //标准
    function randomNum(min,max){
          return Math.floor(Math.random()*(max-min))+Math.floor(min)
    }
    randomNum(min,max)
    

    • 写一个函数,获取从min都max之间的随机整数,包括min包括max

    function randomNum(min,max){
          return Math.floor(Math.random()*(max-min+1))+Math.floor(min)
    }
    console.log(randomNum(6.2342,10.23432)) //输出6、8、10、9、10、6
    

    • 写一个函数,获取一个随机数组,数组中元素为长度为len,最小值为min,最大值为max(包括)的随机整数

    function randomNum(len,min,max){
          var newArr = [];
          for(var i=0;i<len;i++){
                randomNum = min+Math.floor(Math.random()*(max-min+1))
                newArr.push(randomNum)
          }
          return newArr
    }
    console.log(randomNum(4,1,5))
    [2, 2, 3, 2]
    [5, 2, 3, 2]
    [4, 4, 4, 3]
    [3, 3, 2, 4]
    [1, 4, 2, 3]
    [2, 3, 4, 5]
    

    • 写一个函数,生成一个长度为 n 的随机字符串,字符串字符的取值范围包括0到9,a到 z,A到Z。

    function getRandStr(len){
          var str="0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ"
          var result = "";
          for(var i=0;i<len;i++){
                result = result+str[Math.floor(Math.random()*str.length)]
          }
          return result
    }
    var str = getRandStr(10); // "0a3iJiRZap"
    var str = getRandStr(6); //"49vAja"
    

    相关文章

      网友评论

          本文标题:数组、字符串、数学函数

          本文链接:https://www.haomeiwen.com/subject/lbyfyttx.html