代码改变世界

日常问题汇总

2018-04-27 19:16  孤独大兔子  阅读(107)  评论(0)    收藏  举报

1、如何判断一个数组是否指向了同一个地址
其实当时想多了，直接全等就好了
他们比较的是地址。

2、null与undefined是否全等



3、利用filter数组去重（去除重复元素依靠的是indexOf总是返回第一个元素的位置，后续的重复元素位置与indexOf返回的位置不相等，因此被filter滤掉了）

var arr = ['apple', 'strawberry', 'banana', 'pear', 'apple', 'orange', 'orange', 'strawberry'];
var r = arr.filter(function (element, index, self) {
     return self.indexOf(element) === index;
});
r

3.1、简单的数组去重方法 ES6

var b=[...new Set(['apple', 'pear', 'apple', 'orange', 'orange', 'strawberry'])];

3.2  reduce去重

var arr = [1, 2, 3, 3, 4, 2]
var newArr = arr.reduce((pre, cur) => {
    if (!pre.includes(cur)) {
        return pre.concat(cur)
    } else {
        return pre
    }
}, [])
newArr
var arr = [{ id: 1 }, { id: 2 }, { id: 3 }, { id: 7 }, { id: 12, c: 1 }, { id: 1, c: 3 }, { id: 2 }];
var obj = {}
var newArr = arr.reduce((pre, cur) => {
    obj[cur.id] ? '' : obj[cur.id] = true && pre.push(cur);
    return pre
}, [])
newArr;

4、利用filter判断一个数组内的素数

function get_primes(arr) {
    var i;
    return arr.filter(function (element) {  
        var flag=true;  
        if(element<2){  
            flag=false;  
        }else {  
            for(var i=2;i<element;i++){  
                if (element%i==0){  
                    flag=false;  
                    break;  
                }  
            }  
        }  
        return flag;  
    });
}

// 测试:
var x,r,arr = [];
for (x = 1; x < 100; x++) {
    arr.push(x);
}
r = get_primes(arr);
console.log(r)

5、伪类和伪元素的区别

伪类 :hover、:focus、:link...
伪元素 ::after、::before 等。

6、实现单行省略和多行省略

单行： overflow: hidden;text-overflow: ellipsis;white-space: nowarp;

多行：比较靠谱简单的做法就是设置相对定位的容器高度，用包含省略号(…)的元素模拟实现

p {
    position:relative;
    line-height:16px;
    /* 3 times the line-height to show 3 lines */
    height:32px;
    overflow:hidden;
}
p::after {
    content:"...";
    position:absolute;
    bottom:0;
    right:0;
}

另外可以用js来实现

 7、如何判断是否是一个数组

      方法一： arr.constructor.name==="Array"

      方法二：arr instanceof Array

      方法三：Object.prototype.toString.call(arr)==="[object Array]");

8、自己实现一个filter方法

Array.prototype.filter = function(cb, context){
  context = context || this;  //确定上下文，默认为this
  var len = this.length;  //数组的长度
  var r = [];  //最终将返回的结果数组
  for(var i = 0; i < len; i++){
    if(cb.call(context, this[i], i, this)){  //filter回调函数的三个参数：元素值，元素索引，原数组
      r.push(this[i]);
    }
  }
  return r;
};

9、用addEventListener实现点击

<body>
    <ul id="ul1">
        <li>111</li>
        <li>222</li>
        <li>333</li>
        <li>444</li>
    </ul>s
</body>
</html>
<script>
    window.onload = function(){
        var oUl = document.getElementById("ul1");
        var aLi = oUl.getElementsByTagName('li');
        oUl.addEventListener('click',function(e){
            var e = e||window.event;
            var p = e.target.parentNode;
            var tags = p.getElementsByTagName('*');
            for(var i=0,len=tags.length;i<len;i++){
                // 找到节点，返回下标
                if(tags[i] == e.target){
                    console.log(i);  //下标
                    return i;
                }
            }
        })
    }
</script>

10、实现对数组进行乱序

var a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
    sign = 1; 
a.sort(function(a, b) {
    //因为Math.random产生的数在0-1之间
    //所以0.5两边的概率是相等的
    //大于0.5时为升序，小于0.5时为降序
    sign = (Math.random() > 0.5) ? 1 : -1;
    return (a - b) * sign;
 
});

//可省略为
arr.sort(function(a, b){return Math.random() - 0.5});

 11、计算数组中每个元素出现的次数

 var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
  var countedNames = names.reduce(function (allNames, name) { 
    if (name in allNames) {
      allNames[name]++;
    } else {
      allNames[name] = 1;
    }
    return allNames; 
  }, {});
countedNames

12、将二维数组变成一维数组

 var flattened = [[0, 1], [2, 3], [4, 5]].reduce(
      function(a, b) {
        return a.concat(b);
      },[]);
flattened

 13、阻止事件冒泡以及默认行为

//js阻止事件冒泡
//oEvent.cancelBubble = true;
//oEvent.stopPropagation();

//js阻止链接默认行为，没有停止冒泡
//oEvent.preventDefault(); 
//return false;

 14、重写jquery的ajax方法，统一增加请求头

    (function($){
        var _ajax=$.ajax;
        $.ajax=function(opt){
            opt.headers = $.extend(opt.headers,{'setCnahu121233123':'--------------------ok----------------'});
            return _ajax(opt);
        };
    })(jQuery);

 15、创建随机固定数量的数组

function getArr({len,min,max}) {
    let arr = [];
    let index=0;
    while(index<len) {
        index++
        arr.push(min+Math.floor((max-min+1)*Math.random()))
    }
    return arr;
}
var arr = getArr({len:10000000,min:0,max:10000000});

16、找出数组中最大值

方法一
var arr = [1,5,66,184,97,25,34,85,32,46];
arr.sort((a,b)=> a-b)[0];

方法二
var arr = [1,5,66,184,97,25,34,85,32,46];
var sum = 0;
for(var i=0;i<arr.length;i++) {
   arr[i]>sum? sum=arr[i]:sum;
}
sum

方法三
var arr = [1,5,66,184,97,25,34,85,32,46];
Math.max.apply(null,arr);

方法四
var arr = [1,5,66,184,97,25,34,85,32,46];
Math.max.call(null,...arr);

 17、判断对象中是否有某属性

var obj = {name : 'lzhe'}

方法一
test.name;   //"lzhe"
test.age;    //undefined
Obj.x !== undefined;     //可以进行判断

方法二
'name' in obj;   //true
'age' in obj;    //true

方法三
obj.hasOwnProperty('name');  //true
obj.hasOwnProperty('age');   //false

 

@