今日一题:
下面的JS代码执行的结果是什么?
const a = Boolean()
console.log(a);
const b = Boolean(null);
console.log(b);
const c = Boolean(NaN);
console.log(c);
const d = Boolean('false');
console.log(d);
const e = Boolean({});
console.log(e);
const f = Boolean(' ');
console.log(f);
答案和解析可在文章底部查看。
今日面试题:
1、前端进行网站性能优化的方法有哪些?
① 减少HTTP请求
合并CSS和JS文件、使用CSS精灵图合并图片、使用内联SVG代替图片等等。
② 优化文件大小
压缩图片文件、使用适当的图片格式、压缩JS和CSS文件等等。
③ 使用CDN
将静态资源(图片、CSS、JS)等文件放置到CDN上,减少服务器的负载。
④ 减少重绘和重排
尽量减少DOM操作,减少使用会导致重排的CSS属性,如width
、height
等等。
⑤ 注意DOM结构
将CSS样式表放在页面顶部优先加载、减少CSS表达式的使用、优先使用<link>
加载外部样式。
将<script>
放到页面底部、非关键的JS文件使用async
属性进行异步加载、使用defer
属性进行延迟加载、减少JS对DOM的操作。
⑥ 预加载和预取资源
使用<link rel="preload">
在页面加载时提前加载关键资源(如字体、CSS、JavaScript、图像等)。
使用<link rel="prefetch">
在当前页面加载完成后,利用空闲时间预取未来可能需要的资源。
⑦ 启用缓存
设置适当的缓存头(如Cache-Control
、Expires
),让浏览器缓存静态资源,减少重复加载。
使用Service Workers缓存资源,提高离线访问和重复访问的性能。
2、常见的HTTP状态码有哪些?分别表示什么?
① 1XX:信息状态码
- 100 Continue:继续,一般出现在发送
POST
请求中,当已经发送了http header
之后,服务端会返回该状态码,表示确认,继续发送具体参数信息。 - 101 Switching Protocols:切换协议,服务器根据客户端的请求切换协议。
② 2XX:成功状态码1
- 200 OK:请求成功,正常返回信息。
- 201 Created:已创建,请求成功且服务器已经创建新的资源。
- 202 Accepted:已接收,服务器已接受请求,但尚未处理。
- 204 No Content:无内容,服务器成功处理请求,但没有返回任何内容。
③ 3XX:重定向状态码
- 301 Moved Permanently:永久重定向,请求的资源已经被永久移动到新的URL。
- 302 Found:临时重定向,请求的资源临时从不同的URL响应请求。
- 303 See Other:查看重定向,需要使用
GET
从另一个URL获取资源。 - 304 Not Modified:未修改,从上次请求后,资源未修改,可使用缓存的资源。
④ 4XX:客户端错误码
- 400 Bad Request:错误请求,服务器无法理解请求的格式。
- 401 Unauthorized:未授权,要求客户端进行身份验证。
- 403 Forbidden:禁止访问,服务器理解请求,但拒接执行。
- 404 Not Found:未找到,服务器找不到对应的资源。
- 408 Request Timeout:请求超时,服务器等等客户端发送请求的时间过长。
⑤5XX:服务端错误码
- 500 Internal Server Error:服务端错误,服务器遇到错误,无法完成请求。
- 502 Bad Gateway:错误网关,服务器作为网关或代理,从上游服务器收到无效响应。
- 503 Service Unavailable:服务不可用,服务器暂时不可用,通常是由于过载或维护。
3、谈谈对HTML5中语义化标签的理解
HTML语义化的本质是用正确的标签做正确的事,可以让页面的内容结构化,使代码更具可读性,开发者可以更容易地理解和维护代码。
有利于SEO,搜索引擎的爬⾍依赖于标记来确定上下⽂和各个关键字的权重,可以更好理解网页的结构和内容。
还增强了网页的可访问性,视障关怀模式、屏幕阅读器等技术可以更好的解析和朗读语义化标签。
常见的语义化标签:
<header>
、<nav>
、<main>
、<article>
、<section>
、<aside>
、<footer>
、<figure>
等等。
今日一题答案:false、false、false、true、true、true
解析:
在JavaScript中,false
、null
、0
、-0
、''
、undefined
、NaN
这七个特殊值被称为"假值",会在进行布尔判断或通过Boolean()
函数转换时,被转换为false
。
其他值都被称为"真值",会在进行布尔判断或通过Boolean()
函数转换时,被转换为true
。例如:非空字符串('false'
, ' '
等)、非0数字(1
, -1
等)、对象(包括空对象和空数组)、函数(Boolean(() => {})
)等等。