前端面试回答不好的问题总结

本文探讨了Vue组件的生命周期方法,JavaScript闭包的概念,以及CompositionAPI中的setup和ref/reactive的差异。还介绍了防抖和节流技术,以及百度埋点中GIF图的优势。此外,对HTTP和HTTPS的区别,以及浏览器的重排和重绘机制进行了概述。
摘要由CSDN通过智能技术生成

vue生命周期:

beforeCreated、created、beforeMount、mount、beforeUptade、uptade、beforeDestroy、destroyed、 Activated、Deactivated

闭包:

ECMAScript中,闭包指的是:

  1. 从理论角度:所有的函数。因为它们都在创建的时候就将上层上下文的数据保存起来了。哪怕是简单的全局变量也是如此,因为函数中访问全局变量就相当于是在访问自由变量,这个时候使用最外层的作用域。
  2. 从实践角度:以下函数才算是闭包:
    1. 即使创建它的上下文已经销毁,它仍然存在(比如,内部函数从父函数中返回)
    2. 在代码中引用了自由变量
    var scope = "global scope";
    function checkscope(){
        var scope = "local scope";
        function f(){
            return scope;
        }
        return f;
    }
    
    var foo = checkscope();
    foo();

Composition API、setup, 都是组合api 直接说中文谁记得英文名字。

ref 和 reactive的区别

ref与reactive区别

ref定义的是基本数据类型
ref通过Object.defineProperty()的get和set实现数据劫持
ref操作数据.value,读取时不需要。value
reactive定义对象或数组数据类型
reactive通过Proxy实现数据劫持
reactive操作和读取数据不需要.value

let、const和var都是用来声明变量的,但它们之间有一些重要的区别:

  1. 变量的作用域:var声明的变量是函数作用域的,而let和const声明的变量是块级作用域的。这意味着var声明的变量在函数内部和外部都可以访问,而let和const声明的变量只能在声明它们的代码块内部访问。
  2. 变量的可变性:let声明的变量可以被重新赋值,而const声明的变量不能被重新赋值。这意味着,如果你尝试重新赋值一个const声明的变量,你会得到一个错误。
  3. 变量的初始化:var声明的变量可以被声明但未被初始化,而let和const声明的变量必须在声明时被初始化。
  4. 变量提升:var声明的变量会提升到当前作用域的顶部,这意味着你可以在声明之前访问它。而let和const声明的变量不会提升,你必须在声明之后才能访问它们。

总的来说,let和const是ES6引入的更安全、更严格的变量声明方式,而var是ES5引入的,它的使用有一些限制和副作用。

防抖

防抖的原理就是:你尽管触发事件,但是我一定在事件触发 n 秒后才执行,如果你在一个事件触发的 n 秒内又触发了这个事件,那我就以新的事件的时间为准,n 秒后才执行,总之,就是要等你触发完事件 n 秒内不再触发事件,我才执行,真是任性呐!

// 第一版
function debounce(func, wait) {
    var timeout;
    return function () {
        clearTimeout(timeout)
        timeout = setTimeout(func, wait);
    }
}

节流

如果你持续触发事件,每隔一段时间,只执行一次事件。

根据首次是否执行以及结束后是否执行,效果有所不同,实现的方式也有所不同。
我们用 leading 代表首次是否执行,trailing 代表结束后是否再执行一次。


function throttle(func, wait) {
    var timeout;
    var previous = 0;

    return function() {
        context = this;
        args = arguments;
        if (!timeout) {
            timeout = setTimeout(function(){
                timeout = null;
                func.apply(context, args)
            }, wait)
        }

    }
}

百度埋点使用gif图主要是因为gif图具有以下特点和优势:

  1. 跨域支持:互联网广告或网站监测方面常用的手段,简单、安全。利用空白gif或1x1 px的img是互联网广告或网站监测方面常用的手段,简单、安全、相比PNG/JPG体积小。
    1px 透明图,对网页内容的影响几乎没有影响。
  2. 兼容性强:这种请求用在很多地方,比如浏览、点击、热点、心跳、ID颁发等等,图片请求不占用 Ajax 请求限额。
  3. 方便快捷:只要new Image对象就好了,一般情况下也不需要append到DOM中。
  4. 实时监测:可以通过它的onerror和onload事件来检测发送状态。

百度埋点是在网站或应用程序中收集和分析用户行为数据的常见方法之一。通过在代码中嵌入特定的JavaScript,百度埋点可以捕获用户与网站或应用程序的交互信息,如页面浏览、点击、滚动等行为。这些数据可以帮助百度和相关的广告主、网站主等了解用户的行为习惯和需求,从而优化产品和服务。

HTTP和HTTPS的主要区别如下:

  1. 安全性:HTTP是超文本传输协议,信息是明文传输,而HTTPS是具有安全性的SSL加密传输协议。这意味着HTTPS协议可以保护传输的数据不被窃取或篡改。
  2. 证书与费用:HTTPS协议需要到CA(证书授权)申请证书,一般免费证书较少,因而需要一定费用。而HTTP不需要证书,无需支付相关费用。
  3. 连接方式与端口:HTTP和HTTPS使用的是完全不同的连接方式,用的端口也不一样。HTTP连接是无状态的,而HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议。

总的来说,HTTP和HTTPS的主要区别在于安全性、证书与费用以及连接方式与端口。因此,如果您对数据传输的安全性有较高要求,建议使用HTTPS协议。

重排和重绘

重排,重新排列,一般发生在布局变化或者元素大小发生变化时
重绘,重新绘制,一般发生在布局不变,视觉上变化的时候譬如阴影颜色啥的

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值