JS 遇到的面试题_js创建一个长度为10000的数组-CSDN博客

本文链接：https://blog.csdn.net/chose_DoIt/article/details/89084785

for 循环中setTimeout(function () { console.log(i)},1000)中的异步问题

考察：作用域，异步，闭包

	for(var i=0; i<=5; i++){
      (function(){
          setTimeout(function(){
              console.log(i);//6,6,6,6,6,6
          },i * 1000);
      })(i)
     }
     console.log(i);//6


     for(let i=0; i<=5; i++){
      (function(){
          setTimeout(function(){
              console.log(i);//0,1,2,3,4,5
          },i * 1000);
      })(i)
     }
     console.log(i);// 报错：i is not defined



    for(var i=0; i<=5; i++){
      (function(i){
          setTimeout(function(){
              console.log(i);//0,1,2,3,4,5
          },i * 1000);
      })(i)
     }
     console.log(i);//6

详情：https://blog.csdn.net/qq_46028949/article/details/104340435 转载

如何判断数据是基础类型，还是引用类型，有什么方法：

引用类型可用：instanceOf ; isArry; construtor ; Object.prototype.toString.call()

https://www.cnblogs.com/woniubushinide/p/11231646.html转载

跨域

通过JSONP跨域 <script src='http://localhost:9090/student?callback=showData'><\/script>；；； showData(res)

使用 postMessage 转载https://blog.csdn.net/weixin_30410999/article/details/95656622

使用反向代理，通过配置devServer 的proxyTable，指定代理地址

跨域资源共享：CORS跨域

通过websocket

document.domian+iframe

location.hash+iframe

window.name+iframe

详情https://segmentfault.com/a/1190000011145364转载

VUE的css 作用域 scoped原理：

由postCss编译css，给dom添加data-v-something，以及用>>>做scoped穿透等原理

https://blog.csdn.net/maidu_xbd/article/details/106361205?utm_medium=distribute.pc_relevant_t0.none-task-blog-BlogCommendFromBaidu-1.not_use_machine_learn_pai&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-BlogCommendFromBaidu-1.not_use_machine_learn_pai 转载

ElementUI 如何改变主题颜色

npm安装elemnt主题生成工具，安装主题，生成element-variables.scss，修改主题颜色变量，引入文件

https://blog.csdn.net/weixin_44416019/article/details/96976261转载

Vue的双向绑定原理

结合数据劫持和发布者-订阅者模式，通过object.defineProperty 来劫持各个属性的get，set属性，当数据变化时，发布消息给订阅者，触发相应的监听和回调

vue组件之间的通信方法

父子组件：props,$emit; $attrs,$listeners; provide,inject $parent,$children $ref

跨级/祖孙组件： provide,inject $attrs,$listeners; bus; vuex

兄弟组件： bus; vuex

https://segmentfault.com/a/1190000019208626转载

vuex存储与本地储存（localstorage、sessionstorage）的区别

1.区别：vuex存储在内存，localstorage（本地存储）则以文件的方式存储在本地,永久保存（不主动删除，则一直存在）；sessionstorage( 会话存储 ) ,临时保存。localStorage和sessionStorage只能存储字符串类型，对于复杂的对象可以使用ECMAScript提供的JSON对象的stringify和parse来处理

2.应用场景：vuex用于组件之间的传值，localstorage，sessionstorage则主要用于不同页面之间的传值。

3.永久性：当刷新页面（这里的刷新页面指的是 --> F5刷新,属于清除内存了）时vuex存储的值会丢失，sessionstorage页面关闭后就清除掉了，localstorage不会。

注：大家可能觉得用localstorage可以代替vuex, 对于不变的数据确实可以，但是当两个组件共用一个数据源（对象或数组）时，如果其中一个组件改变了该数据源，希望另一个组件响应该变化时，localstorage，sessionstorage无法做到，原因就是区别1。

前端权限控制：接口权限，按钮权限，页面权限，路由权限 https://www.cnblogs.com/guchengnan/p/11800947.html转载

路由守卫：即导航守卫，指通过取消或者跳转的方式守卫路由。即：路由跳转的过程中的钩子函数

二、路由守卫分类

1 全局前置守卫 beforeEach

2 全局后置守卫 afterEach

3 全局解析守卫 beforeResolve

4 路由专享守卫 beforeEnter

5 组件内守卫 beforeRouteEnter,beforeRouteUpdate,beforeRouteLeave

一、导航解析流程

1 导航被触发

2 在失活的组件里调用离开守卫beforeRouteLeave(to,from,next)

3 调用全局前置守卫 beforeEach(to,from,next)

4 在复用的组件里调用beoreRouteUpdate(to,from,next)

5 在路由配置里调用路由独享的守卫beforeEnter()

6 解析异步路由组件

7 在被激活的组件里调用beforeRouteEnter(to,from,next)

8 调用全局解析组件beforeResolve

9 导航被确认

10 调用全局后置守卫afterEach()

11 触发DOM更新

12 用创建好的实例调用beforeRouteEnter守卫中传递给next的回调函数

axios http://www.axios-js.com/zh-cn/docs/#%E6%8B%A6%E6%88%AA%E5%99%A8

支持 Promise API
拦截请求和响应
转换请求数据和响应数据
取消请求
自动转换 JSON 数据
客户端支持防御 XSRF

盒模型分为标准盒模型和 IE盒模型

详情https://blog.csdn.net/qq_42720683/article/details/83584970(转载）

基本数据类型和引用数据类型的区别

详情：https://www.cnblogs.com/cxying93/p/6106469.html 转载

promise 是什么，以及应用https://blog.csdn.net/weixin_41817034/article/details/80492315 转载


let p = new Promise((resolve, reject) => {
        //做一些异步操作
      setTimeout(function(){
            var num = Math.ceil(Math.random()*10); //生成1-10的随机数
            if(num<=5){
                resolve(num);
            }
            else{
                reject('数字太大了');
            }
      }, 2000);
    });

    
p.then((data) => {
    console.log('resolved',data);

    return new Promise((resolve,rejecdt)=>{
        setTimeout(function(){
             resolve('test2')
        },1000)
    })

    console.log(somedata); //此处的somedata未定义
}).catch((err) => {
    console.log('rejected',err);
})

.then((data)=>{
    console.log(data)
})

//输出 
resolved 5
test2

let，const，var 的区别

let， const， var
是否可以重复定义否//报错否//报错是
是否可以被重新赋值是否//报错 [对象，数组，则可以] 是
有变量提升/预解析否//报错否//报错是//undefind （例： console.log(a)// undefind var a = 355 ）
作用域（函数外可用）否否是

属于window顶层对象否//undefind 否//undefind 是//输出值

基本数据类型放在栈内存中，引用数据类型也是放在栈内存中，但他们的值是放在引用地址内，引用地址为：堆内存

const可以改变对象，数组的值

const定义常量的本质不是变量指向的值不能被改变，而是变量指向的地址不能被改变，const定义的常量obj,arry可以被改变，是因为变量指向的地址没有被改变，只是改变了地址内部的堆内存而已。

如果不想 const 声明的对象，数组被改变值，则使用Object.freeze

   function myFreeze(obj){
            Object.freeze(obj);
            //object.keys 返回一个 由对象内所有属性组成的 数组
            Object.keys(obj).forEach(function(key){
                        if(typeof obj[key] === 'object'){
                            myFreeze(obj[key])
                        }
                })
        
        }

ES5 this指向问题（this指向最终调用它的对象，多层调用的情况下，只指向的是上一层对象）https://www.cnblogs.com/pssp/p/5216085.html转载

ES6 箭头函数 this指向问题（指向该函数所处作用域指向的对象）https://zhuanlan.zhihu.com/p/57204184转载

call、apply、bind 定义this指向 https://www.cnblogs.com/pssp/p/5215621.html 转载

模板字符串'${name}'，反引号

ES6解构赋值

解构赋值分为：变量的解构赋值、数组的解构赋值、对象的解构赋值、函数参数的解构赋值

解构赋值的应用场景：变量互换，函数返回值，AJAX返回应用，提取 JSON 数据等 https://blog.csdn.net/weixin_41229588/article/details/90757345转载

ES6不适配所有的浏览器，所以用babel把ES6转化为ES5

安装babel：npm install --save -dev babel-preset-env babel-cli

添加配置文件：.babelrc ，其中，配置{ "presets" : ["env"] }

文件转化：

文件转化：babel src/index.js -o dist/index.js

文件夹转化： babel src -d dist

实时监控： babel src -w -d dist

http，DNS,TCP等

https://www.cnblogs.com/it-cen/p/4899692.html（转载）

有一个数组，元素长度超过10000，求他的最大值和最小值


// 超过10000长度的数组，求他的最大值和最小值
// Array.from()将一个类数组对象或者可遍历对象转换成一个真正的数组。
// 新建一个长度为10000数组，数组元素值为0~10000的随机数
var array = Array.from({length:10000}, value => Math.ceil( Math.random()*10000 ));
// apply 劫持 math的max min方法
var max = Math.max.apply(null, array)
var min = Math.min.apply(null, array)

找出数组中连续重复元素的起始索引

var arr = [1,2,3,9,9,9,9,6,7,8,10,10,10,15]
var dic = {}
for (k in arr){
     if (!dic[arr[k]]){
        dic[arr[k]] = [k]
    }
     else{
        dic[arr[k]][1] = k
    }
 }
for (k in dic){
    if (dic[k].length==1){
        delete(dic[k])
    }
}

console.log(dic)
{ '9': [ '3', '6' ], '10': [ '10', '12' ] }

插入排序法

var group= [1,9,3,5,0,4];

function insertSort(list) {
    for (var i=1;i<list.length;i++){
        var j =i;
        var temp = list[i];
        while(j>0 && list[j-1]>temp){
            list[j]=list[j-1];
            j--;
        }
        list[j]=temp;
    }
return Array.prototype.join.call(list,',');
}

insertSort(group);