广州电信高级前端开发工程师笔试题及答案（国企面试题大全）

js部分

1.问：localStorage,sessionStorage和cookie的区别?

概述：localStorage,sessionStorage是HTML5 Web Storage API 提供的，可以方便的在web请求之间保存数据。sessionStorage、localStorage、cookie都是在浏览器端存储的数据。

共同点:都是保存在浏览器端，且同源的.

区别:

(1）cookie在浏览器和服务器间来回传递；sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。

(2)存储大小：

localStorage存储空间小于等于5M；
sessionStorage存储空间小于等于5M；
cookie存储空间小于4K；

(3)有效性：
localStorage：永久存储，始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；需要手动清除。
sessionStorage：会话级别的存储，仅在当前浏览器窗口关闭前有效，不能持久保持；
cookie：只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭也不会消失；

2.问:下面代码运行后输出结果

        console.log('script start')
        async function async1() {
            await async2()
            console.log('async1 end')
        }

        async function async2(){
            console.log('async2 end')
        }

        async1()

        window.setTimeout(function(){
            console.log('setTimeout end')
        },0)

        var promise1=new Promise(function (resolve,reject) {
            console.log('Promise build')
            resolve()
        })

        promise1.then(function (){
            console.log('promise1 end')
        }).then(function (){
            console.log('promise2 end')
        })

        console.log('script end')
   

 答案依次为:

script start
async2 end
Promise build
script end
async1 end
promise1 end
promise2 end
setTimeout end

3.es6的新特性中，var  let  const之间的区别

       (1)var存在变量提升

       (2) var可重复声明

       (3)var不存在块级作用域

       (4)存在for循环变量污染的问题

let、const   

       (1)不存在变量提升

       (2) 不可重复声明

       (3)存在块级作用域

       (4)不存在for循环变量污染的问题，const一旦声明必须赋值。

4.问：下面代码输出结果

function fun(n, o) {
            console.log(o)
            return {
                fun: function (m) {
                    return fun(m, n)
                }
            }

        }
        var a = fun(0) //undefined a={fun:function(m){ ruturn fun(m,0)}}
        a.fun(1)  // 0  再执行fun(1,0),结果{fun:function(m){return fun(m,1)}}(=>fun(2,1),结果{fun:function(m){retun fun(m,2)}})
        a.fun(2)  //0   再执行fun(2,0),结果{fun:function(m){return fun(m,2)}}
        a.fun(3)  //0   再执行fun(3,0),结果{fun:function(m){return fun(m,3)}}
        var b = fun(0).fun(1).fun(2).fun(3)  //undefined,0,1,2
        var c = fun(0).fun(1)  //undefined,0,
        c.fun(2) //1

5.问：浅拷贝和深拷贝的区别，使用原生js写出一种深拷贝的方法

（1）浅拷贝

浅拷贝之所以被称为浅拷贝，是因为对象只会被克隆最外部的一层,至于更深层的对象,则依然是通过引用指向同一块堆内存.

// 浅拷贝函数
function shallowClone(m) {
  const Obj = {};
  for ( let i in m) {
    Obj[i] = m[i];
  }
  return Obj;
}
// 被拷贝的对象
const originObj = {
  a: 1,
  b: [ 'e', 'f', 'g' ],
  c: { h: { i: 2 } }
};

const newObj = shallowClone(originObj);
console.log(newOb