js 面试 2021-01-10

创建数组和对象有两种方式，一种是new  一种是直接声明  

 

new操作具体做了什么

 

function Star(name,age,sex){

    this.name=name;

    this.age=age;

    this.sex=sex;

    this.sing=function(sang){

        console.log(sang)

    }

}

var lde=new Star("geng",18,"nan")

console.log (lde)

1.创建了一个空对象

2.this指向创建的空对象

3.执行构造函数里边的代码，给这个空对象添加属性和方法

4.返回给这个对象

 

变量提升问题  把已有的局部变量提升到全局变量，只需要把局部变量的值赋值给全局变量

   

闭包

var add = (function () {
var counter = 0;
console.log(counter);
return function () {return counter += 1;}
})();
console.log(counter )

闭包是一种保护私有变量的机制，在函数执行时形成私有的作用域，保护里面的私有变量不受外界干扰，

直观的说就是形成一个不被销毁的栈环境

优点：

可以读取函数内部的变量（函数内部的变量不会被销毁）

避免全局污染，调用函数时会使用函数中定义的变量，不会使用全局变量（变量声明发生冲突）

缺点：

闭包会导致变量不会被垃圾回收机制清除，会大量消耗内存

总结：

作用域链查找变量的方式是一层一层的往上找，直到找到为止，如果找到window全局作用域还未找到，就报undefined

嵌套函数中，因为不在同一作用域，正常情况下内外部函数是访问不到内部函数的，但是通过闭包可以实现

尽可能少的使用闭包，因为会造成内存消耗大以及有可能造成内存泄漏

 

委托事件

把一个或者一组事件委托到它的父级或者更外层元素上，真正绑定事件的是外层元素，

当我们有一个列表，列表之中有大量的列表项，我们需要在点击列表的时候响应一个事件，

如果给每个列表都绑定一个函数，对内存消耗是非常大的，在效率上需要消耗很多性能，

因此比较好的方式是把这个事件绑定到他的父级元素，然后执行的时候再去匹配判断目标元素　　

 

高阶函数

将变量作为参数传递给函数，函数也是如此。我们调用接受或返回另一个函数称为高阶函数

把函数最为参数传入另一个函数，当传入参数被调用时，就称为回调函数

 

ajax的get、post的区别

get方式传送数据量小，处理效率高，安全性低，会被浏览器缓存

post方式传送数据量大，效率低，安全性高，不会被浏览器缓存

 

ajax请求和接受数据

传输数据需要把对象转换json格式

接受需要把json格式的数据转换成对象

 

如何阻止默认事件

return false

 

unll 和undefined等等区别

null是一个表示无的对象，转换数值为0

undefined 表示未定义

undefined是一个表示无的初始值，转为数值为NaN

undefined表示缺少值，就是此处应该有一个值，但是还没有定义

变量被声明了，但是没有赋值，就等于undefined

调用函数时，应该提供的参数没有提供，改参数等于undefined

对象没有赋值属性，该属性的值为undefined

函数没有返回值，默认返回undefined

 

 

js 的作用链域

作用域链的原理和原型很类似，如果这个变量在自己的作用域中没有，那么它会寻找父级，直到最顶层

 

dom 事件流的三个阶段

事件捕获——目标阶段——事件冒泡

目标阶段是最终目标的节点上触发这个事件，就是目标阶段

 

事件冒泡

 

由内到外   事件冒泡

子元素被父元素所包括，所以在点击子元素时也会触发父元素

当使用事件冒泡时，子元素先触发，父元素后触发

 

由外到内   事件捕获

当使用事件捕获时父级元素先触发，子级元素后触发

事件冒泡和捕获的传播可以用stopPropagation（）方法阻止

 

== 和===的不同

==是会自动转换类型，再判断是否相等

===不会自动转换类型，直接去比较也可以说===是完全对比先判断数据类型

document load 和document ready的区别

load是当页面所有资源全部加载完成后（包括DOM文档树，css文件，js文件，图片资源等），执行一个函数

$(document).ready()是当DOM文档树加载完成后执行一个函数 （不包含图片，css等）所以会比load较快执行

 

函数声明和函数表达式的区别

function arr 函数定义

var arr =function  函数表达式

函数声明整体会被提升到当前作用域的顶端，函数表达式也提升到顶部但是只有其变量名提升

以函数声明的方法定义的函数，函数可以在函数声明之前调用，而函数表达式的函数只能在声明之后调用

 

this 的指向问题

在方法中，this表示该方法所属的对象

单独使用，this表示全局对象

在函数中，this表示全局对象

在事件中，this 指向了接收事件的 HTML 元素

null 是只有一个值的数据类型，这个值就是null。表示一个空指针对象，所以unll是object类型

 

js 延迟加载

 先加载html和css 最后加载js

延迟加载

1.defer

2.async

3.动态创建script

4.放在boyd后边

 

什么是window对象  什么是document对象

window对象代表浏览器中打开的一个窗口。document对象代表整个html文档。实际上document对象是window对象的一个属性

 

js严格模式的作用

消除js不合理，不严谨的地方，减少怪异行为

消除代码运行的不安全之处

提高编译器的效率，增加运行速度

为未来js新版本做铺垫

 

Json

json是一种轻量级的数据交换格式，Json基于js规范的一个子集，

采用完全独立编程语言的文本格式来存储和表示数据

 

js同源策略

协议相同　端口相同 　主机相同

 

Jsonp是Json的一种使用模式，可以让网页实现跨越读取数据

 

Cookie是一些数据，存储于你的电脑上的文本文件中

 

JavaScript脚本语言的特点

JavaScript的三大核心： ECMAScript、DOM、BOM

js是一门动态的 弱类型，基于原型的脚本语言  在javaScript一切皆对象，它是面向对象的编程语言

动态性 　是指JavaScript对象中，要为其赋值，不必事先创建一个字段，只需要在使用的时候做赋值操作即可

弱类型 声明变量时无需指定数据类型，解释器会根据上下文对变量进行实例化

弱类型语言的好处在于，一个变量可以很大程度的进行复用

JavaScript是一门解释型语言，特别是在浏览器中的JavaScript

解释型语言是有一定好处，可以随时修改代码，无需编译，刷新页面即可从新解释

 

cookie 是如何在客户机上储存的

cookie就是服务器暂存放在你的电脑的文本文件上，好让服务器来辨认你的计算机。

当你在浏览网站的时候，web服务器会先送一些资料放在你的计算机上，

当你在访问同一个网站，web服务器会先查看有没有上次留下来的cookie资料，有的话，数据传输给你

 

input 中readonly和disable的区别

readonly 可以触发点击事件  disable 不能触发点击事件

readonly属性只针对文本输入框，只是不能编辑想对应的文本 在表单提交时还会被提交

disable属性不能使用事件，用户的所有操作都无效，在提交表单时idsable属性的标签不会被提交

readonly：在表单中为用户填了某个唯一识别代码，不允许用户改动，但是在提交时需要传递该值

disable：防止重复提交数据  或者在商品设置库存不足时也可以使用

 

JavaScript 数据类型

基本数据类型：number、string、boolean、null、underfined

复合数据类型：object 、Array、function

特殊数据类型：NaN（数据运算失败时返回NaN）、null、underfined

 

js 节点标签

元素节点   属性节点  文本节点

 

js降维数组  [ [1,2], [3,4] ] （一个数组中嵌套多个数组）

一、分割数组 二、遍历数组

 

js 数组去除重复元素

使用indexOf 判断新数组是否有要填入的数据  如果有不添加  没有的添加新数组中

 

js降低页面加载时间

优化图片

优化css

网址后加 / 

减少http请求

 

什么是FOUC　　如何避免FOUC

无样式显示页面内容的瞬间闪烁，称之为文档样式短暂失效，简称FOUC

 

浅克隆和深克隆

浅克隆：只复制对象栈的地址，此时对对象的内容的修改直接作用于原对象内容

深克隆：复制对象堆的内容，此时对对象内容的修改是独立的，不会影响之前的对象