跳至主要內容
前端学习目标

前端学习目标

前端工具

  • [x] Write the press release
  • [ ] Update the website
  • [ ] Contact the media

语言类

  • [ ] Node.js 深入及其课程

  • [ ] TS + Vue3 课程

  • [ ] 前端监控系统

  • [ ] 浏览器原理文章整合

  • [ ] Vue-Router API实现

  • [ ] Axios原码实现


Yihui小于 1 分钟前端小目标
JavaScript 获取用户操作系统信息及浏览器信息

JavaScript 获取用户操作系统信息及浏览器信息

部分项目场景中可能需要检测用户当前的浏览器环境,比如当前操作系统是window还是iOS,检测用户是通过什么浏览器访问的(Chrome、IE 等)。网上很多类似的代码,但是随着标准和浏览器更迭有所变动,特此汇总。

window.navigator 属性

只读属性 Window.navigator 会返回一个 Navigator 对象的引用,可以用于请求运行当前代码的应用程序的相关信息。


Yihui大约 3 分钟前端
来认识一下实用的、好用的:URL API

来认识一下实用的、好用的:URL API

JavaScript 代码经常需要操作URL,目前,Node和所有浏览器(除了IE)之外,都实现了URL类用于对其的操作,但它并不是ES标准定义的。这个类是在WHATWG中标准化的。

使用URL() 构造器函数创建URL对象时,可以传入1个绝对URL作为参数,也可以传入2个参数,第一个作为相对URL,第二个传入绝对URL作为base URL。

const myURL = new URL('https://example.org/foo');
// or
const myURL = new URL('/foo', 'https://example.org/');

Yihui大约 2 分钟前端JavaScript浏览器
IIFE 立即执行函数表达式

IIFE 立即执行函数表达式

IIFE全称为Immediately Invoked Function Express-立即执行函数(表达式),顾名思义,是在定义之后立即执行的函数。IIFE主要以保护变量范围著称,时候也会被称为“自执行的匿名函数”(self-executing anonymous function)。

实际使用

闭包

定义在IIFE内部的变量外界是访问不到的。换句话说,当使用letconst声明的变量,在块内部才能访问到。(注:块即为{}定义的范围)


Yihui大约 4 分钟前端JavaScript
怎么总有人混淆Service Worker 和 Web Worker?

怎么总有人混淆Service Worker 和 Web Worker?

Web技术日新月异,我们可以发现21世纪初和现在的网页之间的巨大差异。随着我们对性能提升的体验越好,浏览器或应用程序所需处理的多线程任务就越多。

Service Worker 是如何工作的?

在Service Worker的帮助下,你的浏览器在后台工作,但令人惊讶的是,它不会将当前网页捆绑到后台任务中。Service Worker通常被安装到JavaScript 中,作为脚本在后台运行,并且在脱机时执行。它帮助浏览器处理缓存,并部署从缓存中检索到的合适函数。例如,加载离线博客改善用户体验。


Yihui大约 3 分钟前端JavaScript
TypeScript 面试专题

TypeScript 面试专题

interface 与 type 异同点

这可能是最经典的一道 TS 面试题了,因此这里我们放在第一个知识点来讲解。

及格线

不论如何,以下这些概念是你需要基本了解的,否则很容易被怀疑是否真的深入使用过 TypeScript 。

  • 在对象扩展情况下,interface 使用 extends 关键字,而 type 使用交叉类型(&)。
  • 同名的 interface 会自动合并,并且在合并时会要求兼容原接口的结构。
  • interface 与 type 都可以描述对象类型、函数类型、Class 类型,但 interface 无法像 type 那样表达元组、一组联合类型等等。
  • interface 无法使用映射类型等类型工具,也就意味着在类型编程场景中我们还是应该使用 type 。

Yihui大约 32 分钟面试题前端TypeScript
CJS 和 ES Module 横向对比

CJS 和 ES Module 横向对比

ES Module

export关键字

export关键字将一个模块中的变量、函数、类等导出;

我们希望将其他中内容全部导出,它可以有如下的方式:

  • 方式一:在语句声明的前面直接加上export关键字
export const myName = "ypf";
export const myAge = 18;
export function foo() {
	console.log("foo start");
}
export class Person {
	GetMsg() {
		console.log("Person GetMsg start");
	}
}

Yihui大约 5 分钟前端JavaScript
2
3
4
5