前端知识汇总2020-07-13

1. 数组

1.1 数组排序,取数组前5位,将数组倒序

let arr = [8, 9, 3, 7, 6, 8, 4, 5];
arr.sort((a, b) => a - b).splice(0,5).reverse();
//[7, 6, 5, 4, 3]

推荐把这里的方法都自己运行一下试试Array 对象

1.2 算法实现，数组长度为5且元素的随机数在2-32间不重复的值

//第一种写法
   let arrFive = () => {
        let arr = [];
        for (arr.length; arr.length < 5; arr.length) {
          let num = Math.floor(Math.random() * 30 + 2);
          if (arr.every(item => item != num)) {
            arr.push(num);
          } 
        }
        return arr;
      };
//第二种写法
let arrFive = () => {
        let arr = [];
        for (arr.length; arr.length < 5; arr.length) {
          let num = Math.floor(Math.random() * 30 + 2);
          if (!arr.includes(num)) {
            arr.push(num);
          } 
        }
        return arr;
      };

1.3 数组去重

Js中数组去重的几种方法

2. 对象

2.1 将一个对象的属性值相加求和

let obj = {a:1,b:2,c:3};
Object.values(obj).reduce((x,y)=>x+y);
// 6

2.2 如何让对象的值都为空

const formData = {gbhh:'',wxnx:'',dydj:'',xmgl:''}
//关闭模态框时希望数据清空 此时可用
Object.keys(formData).map(key=>formData[key] = '')
//或者赋值时
Object.keys(formData).map(key=>formData[key] = key)

如何设置遍历多个对象，让他们的val值为空

3.字符串

3.1 输入任意一个字符串，判断这个字符串是否是回文，回文示例： 上海自来水来自海上

js回文数的四种判断方法

let isTure = (x)=>{
if(x<0){
return false
}
let str = ''+x;
return Array.from(str).reverse().join("") === str
}
isTrue('上海在海上')
//true

延伸一下的话

//字符串转数组，反转，转成数组，进行比较 
var str="How are you doing today?"

Array.from(str).reverse().join('')
//"?yadot gniod uoy era woH"

str.split("").reverse().join('')
//"?yadot gniod uoy era woH"

str.split("") 
//["H", "o", "w", " ", "a", "r", "e", " ", "y", "o", "u", " ", "d", "o", "i", "n", "g", " ", "t", "o", "d", "a", "y", "?"]

Array.from(str)
// ["H", "o", "w", " ", "a", "r", "e", " ", "y", "o", "u", " ", "d", "o", "i", "n", "g", " ", "t", "o", "d", "a", "y", "?"]

str.split("")===Array.from(str)
//false 
//因为JavaScript是不能用==或===操作符直接比较两个数组是否相等的。==或===操作符只能比较两个对象是否是同一个实例，也就是是否是同一个对象引用。
JSON.stringify(str.split("")) == JSON.stringify(Array.from(str))  
//true
str.split("").toString() == Array.from(str).toString()
//true

let arr = [1,2,3,4,5]
arr.toString()
//"1,2,3,4,5"
arr.join("")
//"12345"
arr.join(",")
//"1,2,3,4,5"

JS判断两个数组是否相等
js 判断数组中的值是否都相等
关于JS中判断两个数组相等

3.2 如何确定一个字符串是否包含在另一个字符串中

JavaScript确定一个字符串是否包含在另一个字符串中的四种方法

3.3 如何清除字符串中的空格

  arrFive = val => {
        let str = "" + val;
        let cost = str
          .split("")
          .filter(item => item && item.trim())
          .join("");
        return cost;
      };
      //转换成数组 去掉空格转换回来
      arrFive = val => {
        let str = "" + val;
        let cost = Array.from(str)
          .filter(item => item && item.trim())
          .join("");
        return cost;
      };

3.4 如何判断数据类型

var a = Object.prototype.toString;
 
console.log(a.call(2));
console.log(a.call(true));
console.log(a.call('str'));
console.log(a.call([]));
console.log(a.call(function(){}));
console.log(a.call({}));
console.log(a.call(undefined));
console.log(a.call(null));

JS中数据类型的判断（ typeof，instanceof，constructor，Object.prototype.toString.call() ）

3.5 请去除字符串中的最后一位字符

qingchu(x) {
      let a = [...x];
      a.pop();
      a.join("");
      return a;
    },

4. Vue

4.0 生命周期

选项-生命周期钩子

4.1 created和mounted的区别

vue中created钩子函数与mounted钩子函数的使用区别
vue中created和mounted的区别浅析

4.1.1 mounted中页面为什么可见

4.1.2 如何在created中求到挂载的实例对象

4.2 props的写法,default的作用

vue中props的默认写法
默认值得类型为数组或者对象，一定要在函数中返回这个默认值，而不是直接写，否则报错

4.3 这个项目里的mixin是什么意思，是怎么用的

vue之mixin理解与使用
混入

5.ES6

5.1 箭头函数写法

箭头函数

      //箭头函数
      x => x * x
      //普通写法
      function (x) {
          return x * x;
      }