JavaScript考试题 （三）

一.根据一个数字日期，判断这个日期是这一年的第几天

例如： 2016和02和11，计算后结果为42
   

var date = prompt("请输入数字日期：")
    date = Number(date)
    var year = parseInt(date / 10000)
    var month = parseInt((date - year * 10000) / 100)
    var day = parseInt(date - year * 10000 - month * 100)
    var num = 0
    switch (month) {
        case 12: num += 30
        case 11: num += 31
        case 10: num += 30
        case 9: num += 31
        case 8: num += 31
        case 7: num += 30
        case 6: num += 31
        case 5: num += 30
        case 4: num += 31
        case 3: num += 31
            if (year % 400 == 0 || year % 4 == 0 && year % 100 != 0) {
                num += 29
            } else (
                num += 28
            )
        case 2: num += 31
        case 1: num += day
            break;
        default: alert("输入错误")
    }
    document.write(num);

二.红灯三秒亮一次，绿灯一秒亮一次，黄灯2秒亮一次；如何让三个灯不断交替重复亮灯？（用Promse实现）三个亮灯函数已经存在 提示可以使用递归来实现

 function getLight(name, num, color) {
        document.getElementsByClassName(name).style.backgroundColor = color;
        document.getElementsByClassName(name).innerHTML = num;
        return new Promise(function (resolve, reject) {
            let myTimer = setInterval(function (params) {
                num--;
                if (num <= 0) {
                    num = 0;
                    clearInterval(myTimer);
                    myTimer = undefined;
                    document.getElementsByClassName(name).style.backgroundColor = "white";
                    resolve();
                }
                document.getElementsByClassName(name).innerHTML = num;
            }, 1000)
        })
    }
    function shanshan() {
        getLight(red, 5, red).then(function () {
            return getLight(green, 5, green)
        }).then(function () {
            return getLight(yellow, 5, yellow)
        }).then(shanshan);
    };
    shanshan();

三.以下代码最后输出什么？（考察eventloop）

const first = () => (new Promise((resolve, reject) => {
        console.log(3);//同步代码
        let p = new Promise((resolve, reject) => {
            console.log(7);//同步代码
            setTimeout(() => {
                console.log(5);//宏任务
                resolve(6);
            }, 0)
            resolve(1);
        });
        resolve(2);
        p.then((arg) => {
            console.log(arg);
        });
    }));
    first().then((arg) => {
        console.log(arg);
    });
    console.log(4);//同步代码
// 输出结果为3，7，4，1，2，5

四.封装一个函数实现判断100以内的素数
 // 求1-100的素数 

 function getSuNum(num) {
        let str = '';
        for (let i = 2; i < num; i++) {
            for (let j = 2; j < i; j++) {
                if (i % j === 0) {
                    break;
                } else if (i === j) {
                    str += i + " "
                }
            }
            return str;
        }
        console.log(getSuNum(100));
    }

五.封装一个函数计算给定数组 arr 中所有元素的总和 （数组中的元素均为 Number 类型）
  

  function getAddNum(arr) {
        let sum = 0;
        for (let i = 0; i < arr.length; i++) {
            sum += arr[i];
        }
        return sum;
    }
    console.log(getAddNum([1, 2, 3, 4]));

六.数组的方法都有哪些(至少12个), 哪些方法可以改变原数组?
改变原始数组：
①arr.push(元素1，元素2...)尾加

    返回值：追加数据之后数组的最新长度 参数：一个或者多个元素

②arr.pop()尾删  返回值：被删除的数据  参数：无

③arr.unshift(元素1，元素2...)头增  返回值：追加数据之后数组的最新长度

④arr.shift()头删  返回值：被删除的数据

⑤arr.reverse()反转数据  返回值：反转之后的数组

⑥arr.sort()排序返回值：排序后的数据

    arr.sort(function(a,b){return a-b})a-b就是从小到大

    arr.sort(function(a,b){return b-a})b-a就是从大到小

⑦arr.splice(索引)开始索引删除到最后   返回值：以数组形式返回删除的元素

   arr.splice(索引，长度n)从索引开始删除到n个  返回值：以数组形式返回删除的元素

   arr.splice(开始索引，长度n，元素1，元素2...)从索引开始删除到n个后，在删除的位置增加元       素1，元素2  返回值：截取出来的新数数组

不改变原始数组
⑧arr.concat(元素1，元素2...)数组的拼接

返回值：拼接好的新数组  参数：一个或者多个数组

⑨arr.join(‘连接符’)将数组中的数据连接成一个字符串。

返回值：空字符串或者连接好的字符串

⑩arr.slice(开始索引，结束索引) 截取数组内的数据  返回值：截取出来的新数组

    (包前不包后,可写负数)

①①arr.indexOf(数据)从左到右找该数据第一次出现的位置、索引，找不到该数据就返回-1

       arr.indexOf(数据，开始索引)从开始索引位置后找该数据第一次出现的位置

        返回值：数据对应的索引，找不到该数据就返回-1

①②lastIndexOf()和indexOf一样，只不过是从后向前找

七.请说一下你对Promise的理解?
Promise 是异步编程的一种解决方案，是一个构造函数，自身有all、reject、resolve等方法，实例对象上有then、catch等方法，所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作，如ajax请求）的结果

八.说一说this在不同场景下的指向?
  1.与事件体连用,代表触发事件的元素本身

  2.与普通函数连用,代表调用该函数的对象

  3.与构造函数连用时，代表new出来的对象

  4.与箭头函数连用时，箭头函数没有this ，它的this是他父元素的前缀

九.简述call,appy,bind三个方法?
①call和apply：
     1、call和apply都是函数的一个方法（函数）,

     2、call和apply都是在调用原函数。

     3、call和apply是可以改变原函数里的this指向的。

     4、call和apply的第一个参数就是原函数的this指向。

     5、call可以把函数和对象解耦（耦合度：依赖程度/关联程度。高内聚，低耦合）

     6、call和apply的区别（仅仅只是格式上的区别）： 1）、call函数从第二个参数朝后的参数是原函数的参数 2）、apply函数只有两个参数，第二个参数是个数组，数组里是原函数的参数。这样的话，apply第二个参数就可以使用arguments。

②bind和call、apply的区别：
相同点：  bind,call,apply都可以改变this的指向。

不同点：1、bind不会调用原函数，而会产生一个新的函数（bind的返回值是新函数）,新函数里的this是bind时的对象。bind有强烈绑定的意思。只要调用bind，那么对象和函数就永远绑定起来了。 2、call和apply会调用原函数      

十.http和https有什么区别?
①https协议需要到ca申请证书，一般免费证书较少，因而需要一定费用。

②http是超文本传输协议，信息是明文传输，https则是具有安全性的ssl加密传输协议。

③http和https使用的是完全不同的连接方式，用的端口也不一样，前者是80，后者是443。

④http的连接很简单，是无状态的；HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议，比http协议安全

十一. Get和post有什么区别?
①相同点：
get和post就是客户端给服务器传输数据（携带的参数）的方式。

②不同点：
get: 速度快，传输的数据量小，安全性不好，get的数据在请求行发送的（请求行的地址发送到） ​ post:速度慢，传输的数据量大，安全性好，post的数据在请求体发送的

十二.请说一说你对eventloop的理解?
浏览器的事件循环分为同步任务和异步任务；所有同步任务都在主线程上执行，形成一个函数调用栈（执行栈），而异步则先放到任务队列里，任务队列又分为宏任务与微任务。下面的整个执行过程就是事件循环

十三.请写出Ajax请求的核心步骤?
   

 function getData() {
        // 1、创建XMLHttpRequest。
        let xhr = new XMLHttpRequest();
        // 2、设置请求的地址，请求方式，是否异步(默认是异步)
        xhr.open("get", "http://118.178.238.19:3001/api/banner/list");
        // 3、设置：当后端响应回来后，需要干什么
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4 && xhr.status == 200) {
                // 5、获取后端响应回来的数据：xhr.responseText
                console.log("xhr.responseText", xhr.responseText);
            }
        }
        // 4、发送请求
        xhr.send();
    }

十四.求斐波那契数列的第n项的值, 要求能算出第50项, 第100项的值
  

 function Fibonacci(n) {
        var n1 = 1;//储存f-2
        var n2 = 1;//储存f-1
        var n3 = 0;//储存取得值
        //i=2,因为第一个算的就是第三个的值
        for (var i = 2; i < n; i++) {
            n3 = n1 + n2;
            //为取下一个值做准备，原来的n-1变成n-2，当前取出的值变成了下一个的n-1
            n1 = n2;
            n2 = n3;
        }
        return n3;
    }
    console.log(Fibonacci(50));

 十五.实现数组/对象的深拷贝
// 实现对象深拷贝：for循环 + 递归=========================================================

 function copyObj(obj) {
    var newobj = {};
    for (var key in obj) {
      if (typeof obj[key] == 'object') {
        newobj[key] = copyObj(obj[key]);//发现 obj的键对应的值是复杂数据类型，让复杂数据类型在进行函数的调用
      } else {
        newobj[key] = obj[key];// 向newobj添加键值对，键是key，值是key对应的值
      }
    }
    return newobj;
  }
  var obj = { name: "zs", wife: { name: "zs的妻子" } }
  var newobj = copyObj(obj);
  console.log(obj);//{name: 'zs', wife: {…}}
  console.log(newobj);//{name: 'zs', wife: {…}}
  obj.wife.name = 'ls的妻子'
  console.log(obj.wife.name);//ls的妻子
  console.log(newobj.wife.name);//zs的妻子

// 实现数组深拷贝：

JSON.parse(JSON.stringify())===========================================
  var arr = [12, [12, 34, 56, 67], [12, 34, 65]];
  var newarr = JSON.parse(JSON.stringify(arr))
  console.log(newarr);
  //  第一层相互受影响吗？ 不影响
  arr[0] = 10
  console.log(arr[0]); // 10
  console.log(newarr[0]); // 12
  // 第二层相互受影响吗？ 不影响
  arr[1][0] = '新'
  console.log(arr[1][0]); // "新"
  console.log(newarr[1][0]); // 12

 
  // 封装一个函数，既能实现数组的拷贝，也能实现对象的拷贝==================================
   

 function copyEle(ele) {
        if (ele instanceof Array) { // 如果ele是数组的类型
            var newarr = [];//创建一个新的空间
            for (var i = 0; i < arr.length; i++) {
                if (typeof (arr[i]) == 'Object') {
                    newarr.push(copyArr(arr[i]))
                } else {
                    newarr.push(arr[i])
                }
            }
            return newarr;
        } else if (ele instanceof Object) { // 判断传入的是不是对象类型
            var newobj = {};
            for (var key in obj) {
                if (typeof obj[key] == 'object') {
                    newobj[key] = copyObj(obj[key]);//发现 obj的键对应的值是复杂数据类型，让复杂数据类型在进行函数的调用
                } else {
                    newobj[key] = obj[key];// 向newobj添加键值对，键是key，值是key对应的值
                }
            }
            return newobj;
        }else{
            return "请传入数组或者对象类型"
        }
    }

十六.实现字符串的反转( 不能使用split和reverse方法 )
  

 function reverseString(str) {
        var newStr = "";
        for (var i = str.length - 1; i >= 0; i--) {
            newStr += str[i];
        }
        return newStr;
    }
    console.log(reverseString('hello'));

十七.对象转为查询字符串格式

 function getObj(obj) {
        var str = '';
        for (var k in obj) {
            str += `${k}=${obj[k]}&`
            str = str.slice(0, -1)
        }
        return str;
    }
    let newobj = {
        name: "zs",
        sex: "男",
        age: 18
    }
    console.log(getObj(newobj));//name=zssex=男age=18

========================================================================================
   

let obj = {
        name: "capper",
        age: 18,
        sex: "男"
    }
    let url = "https://www.antgroup.com?"
    function getStr(url, obj) {
        let str = "";
        for (let key in obj) {
            str += `${key}=${obj[key]}&`
        }
        str = `${url}${str}`
        return str;
    }
    console.log(getStr(url, obj));

十八.查找字符串数组中的最长公共前缀（如果不存在公共前缀，返回空字符串 ""）
输入：["flower","flow","flight"]

输出："fl"

function publicPrefix(arr) {
        let i = 0;//字符串的下标。
        while (true) {
            let char = arr[0][i];//数组第一个元素的第i个字符
            // j是数组的下标
            for (let j = 1; j < arr.length; j++) {
                if (char != arr[j][i]) {
                    return arr[0].substring(0, i);
                }
            }
            i++;
            if (i > arr[0].length - 1) {
                return arr[0];
            }
        }
    }
    console.log(publicPrefix(["flower", "flow", "flight"]));//fl

十九.请阅读如下代码（非严格模式下），写出结果，并写出为什么？
  

const promise1 = new Promise((resolve, reject) => {
        console.log('promise1');//同步
        resolve();
    })
    promise1.then(() => {
        console.log(3);//微任务
    })
    console.log(1);//同步
    const fn = () => new Promise((resolve, reject) => {
        console.log(2);//同步
        resolve('success')
    })
    fn().then((res) => {
        console.log(res)//微任务
    })
    console.log('start');//同步
 
// 输出结果为：promise1，1，2，start，3，success