首页 > 其他分享 >前端面经每日一题Day13

前端面经每日一题Day13

时间:2024-12-16 20:28:15浏览次数:8  
标签:脚本 上下文 函数 对象 面经 Day13 一题 执行 页面

script放到head中会怎么样?

script标签可以放到head标签里面,也可以放到body标签里面,但是由于浏览器解析HTML文件会从上到下,所以为了防止阻塞页面渲染,我们一般放到body标签的最下面。

  1. 阻塞页面渲染。因为浏览器解析HTML,遇到script标签会停止解析HTML,先下载执行脚本。如果脚本过大,就会导致页面渲染阻塞。
  2. 依赖问题。如果脚本依赖于页面中的元素,但是页面中元素未加载,那么脚本可能因为找不到元素而出错。
  3. 如何解决不让script标签阻塞页面渲染?
  • script脚本放到body标签结尾。脚本会在页面解析完成之后执行,不会阻塞页面渲染。
  • asyncdefer/async属性。异步加载脚本,等待页面解析完之后执行。

script标签的属性

  1. src 指定外部脚本文件的URL
  2. type指定脚本的MIME类型。它通常是text/javascript表示将内容作为JavaScript代码执行。 在HTML5中可以省略。application/json 用于包含JSON数据的脚本,不会作为JavaScript代码执行。
  3. type=‘module’ 按照ES6模块规范来解析执行脚本,即可以使用import/export
  4. async 异步加载脚本,加载完立即执行,不会等待页面解析完成。有可能在DOM元素之前执行。
  5. defer 异步加载脚本,等待整个页面解析完成之后才执行。
  6. charset 指定脚本的字符编码。一般是UTF-8 很少使用

DOMBOM

  • BOM对象即,window对象表示浏览器打开的窗口。提供了控制窗口行为和访问窗口属性的接口。
    • 常用属性如下
    • location对象,当前URL相关信息。
    • history对象,提供对浏览器会话历史的访问,允许在会话历史中导航
    • navigator对象,浏览器的相关信息,如类型,版本等
    • screen对象,用户屏幕信息。如分辨率等
    • innerHeight/innerWidth,浏览器窗口内部宽高
    • scrollX/scrollY,文档在水平和垂直方向上的偏移量。
  • DOM对象即document对象,代表整个HTML文档,提供了访问和操作文档内容的接口。
  • 关联:document对象是window对象的属性。

JavaScript的执行上下文

执行上下文是JavaScript代码执行环境的抽象概念。JavaScript在运行时用来管理代码执行的机制。

包含:

  • 变量对象(函数参数,内部变量,函数声明)
  • 作用域链(当前执行上下文的父级对象的执行上下文的变量对象集合)
  • this值(当前函数的执行环境 ,在全局执行上下文中,this指向全局对象。在函数执行上下文中,this的指向取决于函数的调用方式。)

类型:

  • 全局执行上下文,最基础的执行上下文。每个JavaScript只有一个全局执行上下文。
  • 函数执行上下文,当函数被调用的时候,会为该函数创建一个新的执行上下文,函数执行完毕,函数上下文被销毁。
  • eval执行上下文,代码在eval函数中执行,创建执行上下文。

代码执行过程:首次运行JavaScript时候,浏览器引擎会创建一个全局执行上下文,添加到执行栈中,在退出浏览器的时候从执行栈中移除全局执行上下文。JavaScript代码逐行执行,遇到函数的时候,函数执行上下文被推入执行栈顶部,全局执行上下文被挂起,开始执行函数中的代码,函数执行完,函数执行上下文被移除执行栈,全局上下文主导,继续执行。

迭代器

提供了一种统一的方式来访问集合中的元素,无需了解集合内部结构。

原理:本身是一个对象,提供了一个next方法,可以返回结果对象,结果对象包含value(当前 遍历元素的)和done(完成迭代true)

标签:脚本,上下文,函数,对象,面经,Day13,一题,执行,页面
From: https://blog.csdn.net/m0_73918807/article/details/144513885

相关文章

  • JAVA面经汇总(2024全年整理)
    开始之前,先说一下我非常推荐的一种学习方式:带着问题学习或者准备面试。另外,准备面试的小伙伴,一定要根据自身情况制定好复习计划! 并且,你最好还要时不时自测一下,对着一些面试常见的问题进行自问。最近,我分析了上百份大中小厂的面经,发现了许多Java面试中最最最常问的一些......
  • 【每日一题】20241216
    【每日一题】已知函数\(f(x)=\sin|x|+2|\sinx|\),则\(f(x)\)在\((-2\pi,\pi)\)的零点个数为________.已知函数\(f(x)(x\in\mathbf{R})\)满足\(f(-x)=2-f(x)\).设方程\(f(x)-\frac{x+1}{x}=0\)的\(m\)个实数根分别为\(x_1,x_2,\cdots,x_m\),且\(y_i=f(x_i)\left(i=1......
  • 【每日一题】20241215
    【每日一题】已知复数\(z\)在复平面内对应的点位于第四象限,且满足\(|z|=\sqrt{3}\),\(|z^2+2z-3|=2\sqrt{6}\),则\(z=\)________.已知函数\(f(x)=A\sin(\omegax+\varphi)(A>0,0<\varphi<2\pi)\)的部分图象如图所示,则下列命题正确的为_________(写出所有正确命题的编号).①.......
  • 前端面经每日一题day11
    前端面经整理-CSDN博客我找到内容题目就是在这里面,详细可以看这个。了解浏览器缓存机制浏览器缓存就是把已经请求过的资源存储起来,当下次需要该资源的时候,浏览器会根据缓存机制决定是直接使用缓存的资源还是向服务器发送请求。作用:降低服务器压力强制缓存>协商缓存强制......
  • 前端面经每日一题day10
    登陆后,如何得知已登录?前端把服务器返回的认证信息(cookie/token/sessionID)等存储在本地(localstorage,sessionstorage,cookie),表明已经登录,并设置超时时间。前端性能优化的方法浏览器渲染机制,减少使用重绘重排。事件处理程序,使用事件委托。网络请求优化,善用缓存,不重复加载相同......
  • 前端面经每日一题Day12
    题目来源可以看这个博客  前端面经整理-CSDN博客做这个每日一题的初衷就是为了让自己能够每天有所收获,每天都能学习,而且还能激发我深入学习,但是我发现慢慢的我的初衷好像变了,变成了每天发博客就行,因为学习相对太难了,我最近需要重新看待我的行为,不能为了做什么而做,我的目的不......
  • 【每日一题】3266. K 次乘运算后的最终数组 I&II
    给你一个整数数组 nums ,一个整数 k  和一个整数 multiplier 。你需要对 nums 执行 k 次操作,每次操作中:找到 nums 中的 最小 值 x ,如果存在多个最小值,选择最 前面 的一个。将 x 替换为 x*multiplier 。k 次操作以后,你需要将 nums 中每一个......
  • 【CSS 面经】如何使用纯 CSS 实现一个三角形
    文章目录一、CSS三角形的基本原理1.利用边框生成三角形2.三角形的构造过程示例:向下的三角形二、改变三角形的方向向上的三角形向左的三角形向右的三角形三、CSS三角形的应用场景1.下拉菜单箭头2.对话框的指示3.布局装饰四、常见的面试考察点1.如何实现一个CS......
  • GDB调试面经
    1.linux下,如何debug查看内存泄露问题?在linux系统中可以使用top命令实时显示系统中进程的内存使用情况。free命令显示了系统中空闲和已使用的内存。使用valgrind是一个强大的内存调试和分析工具,它可以检测内存泄漏和其他内存相关的问题。'''valgrind--leak-check=yes--show-le......
  • 2025年Java面经(附答案)
    一、Java基础部分面试题1.Java面向对象的三个特征封装:对象只需要选择性的对外公开一些属性和行为。继承:子对象可以继承父对象的属性和行为,并且可以在其之上进行修改以适合更特殊的场景需求。多态:允许不同类的对象对同一消息做出响应。2.Java中基本的数据类型有哪些以......