面试题JavaScript02【2021-10】

一、请谈谈你对 Ajax 的理解,通常你如何实现 Ajax 操作

        Ajax是一种局部刷新技术,可以向服务器发送请求进行DOM操作

        实现:

                原生JS

                        XMLHttp(兼容性好)

                        fetch(H5提供的)

                脚本库

                        jQuery

                        axios

        原生js的步骤:

//get
var xhr = new X MLHttpRequest();
xhr.open('GET',URL, true);
xhr.onreadystatechange = function(){
    if(xhr.readyState == 4 && xhr.status == 200){
        var res = JSON.parse(xhr.responseText);
        if(res.Code != 0){
            return ;
        }
        res.Data.forEach(function(item){
            ...
        }
    }
}
xhr.send();

//post
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

二、讲一下你对 CORS 的理解,如何实现跨域请求?

        关于CORS跨域问题的理解 - 如是说 - 博客园

        问的是同源策略和跨域请求。

        CORS是一个w3c标准,全称是“跨域资源共享”,一个请求Url的协议、域名、端口三者之间有一个与当前页面地址不同即为跨域。

        img/audio/video/css/script都是可以跨域的,只有ajax请求是不可以跨域的

        前端要想解决跨域问题,需要用nginx反向代理

三、谈谈你对 this 的理解

        在普通函数里,this在严格模式指向undefined,非严格模式指向window

        在构造函数中,this指向实例本身

        在对象方法里,this指向实例

        在箭头函数中,this指向父执行环境(执行环境)

        用call、apply、bind可以改变this的指向

四、如何判断一个对象是否属于某种类型?

        1-typeof        只适合基本数据类型

        2-instanceof 可以判断对象数据类型,基于原型链

        3-constructor 指向prototype对象所在的构造函数

        4-Object.prototype.toString.apply() 内置的

五、谈谈你对 json 与 xml 的认识

        共同点:功能:实现不同平台、语言、系统之间的数据传递

        XML:扩展标记语言,通过自定义标签描述数据结构及关系

        看起来非常冗余,解析起来比较难

<persons>
    <person>
        <id>1</id>
        <name>Rose</name>
    </person>
    <person>
		<id>2</id>
		<name>Jack</name>
	</person>
</persons>

JSON:解析非常快  JSON.stringify|parse

persons =[
		{id:1,name:'Rose'},
		{id:2,name:'Jack'}
	]

六、在 JavaScript代码包含在一个自执行函数块中有什么意思呢?为什么要这么做?

        在javascript中自执行函数的目的是什么?_慕课猿问

        自调用函数是函数在定义时立即执行

        它将代码保持在最低限度,强制将行为与表达分开,提供了一个阻止命名冲突的闭包,可以封装,可以将所有.js文件包含在自执行功能中,并可以防止全局命名空间污染

七、Javascript 的事件流模型都有什么

        理解JavaScript中的事件处理 _大巧不工-CSDN博客

        事件冒泡模型 先子后父(默认)

        事件捕获模型 先父后子

        addEventListener里的true和false

八、事件绑定的几种方法

        行内、事件属性、addEventListener

        xxx.onclick = function(){}  一个事件源的一个处理程序只能绑定一个方法,多了会覆盖

        addEventListener             一个事件源的一个处理程序可以绑定多个方法,第三个参数true|false可以确实是冒泡还是捕获

                                                可以用removeEventL移除

                                                缺点:兼容性不好,低版本的IE不支持,但是可以用attachEvent代替

九、什么是事件冒泡,如何阻止事件冒泡和事件默认行为

        事件冒泡,先子后父

        JS阻止冒泡和取消默认事件(默认行为)-前端开发博客

        阻止冒泡和捕获:event.stopPropagation()

        取消默认行为:    event.preventDefault()

        return false

十、谈谈你对事件代理的理解,你是如何实现的

        JS事件代理的理解 - 简书

        事件代理是为了提高性能,利用事件冒泡来实现的

        实现1:onclick + e.target

        实现2:addEventListener

十一、window 的 load 事件 和 document 的 DomContentLoaded 有什么区别

        load是所有资源加载完毕后才会触发,DOMContentLoaded是在DOM树加载完毕后就会触发

十二、写出下列代码的输出结果

        1 + "2" + "2"                122

        1 ++ "2" + "2"`             报错 

        1 +- "1" + "2"                02

        + "1" + "1" + "2"            112

        "A" - "B" + "2"               NaN2

        "A" - "B" + 2                  NaN

十三、下列代码的输出结果是

        0.1 + 0.2                   0.30000000000000004

        0.1 + 0.2 == 0.3        false

十四、请编写代码,让表达式 a==1 && a == 2 返回 true

        高阶函数

        面试题如何实现a===1 && a===2 && a===3返回true_前端学习者小白的博客-CSDN博客

        JavaScript (a ==1 && a== 2 && a==3) 有可能是 true 吗?_前端kit的博客-CSDN博客

        JavaScript:(a==1 && a==2 && a==3)能输出ture么?_weixin_33946605的博客-CSDN博客

猜你喜欢

转载自blog.csdn.net/weixin_43961652/article/details/121218531