leetcode 100
链表反转链表单链表的头节点 head ,请反转链表,返回反转后的链表。
12345678910111213var reverseList = function (head) { if (!head) return null; // 返回 null 而不是空数组 let cur = head; let pre = null; while (cur) { let next = cur.next; // 正确地将 next 设置为 cur.next cur.next = pre; // 反转指针 pre = cur; // 移动 pre 到当前节点 cur = next; // 移动 cur 到下一个节点 } return pre; // pre 成为新链表的头节点};
链表固定区间反转链表
遍历到第 m-1 个节点:这个节点是反转开始节点的前一个节点。
反转第 m 到 n 个节点:我们需要通过迭代反转这部分链表的节点。
重新连接链表:将反转后的子链表正确连接 ...
菜鸟前端面试记录U·ェ·U
介绍自己面试官你好,我叫任蓉,来自四川南充,目前研三,就读于重庆邮电大学软件工程专业,我这次应聘的岗位是前端开发工程师的岗位。
在本科阶段我主修了软件工程、数据结构、计算机网络等专业课程。在研究生阶段,我的研究方向为计算机视觉,目前已经发表一篇EI论文,另外还有一篇中文核心在投。
为了毕业进入前端的行业,我自学了前端的相关基础知识,并且拥有两段相关实习经历,第一段是在同程旅行公司的实习,在这段实习中,我主要参与了Martix项目管理系统的迭代开发和轻任务多维数据平台的开发这两个项目。在Martix项目的开发过程中,我主要负责实现通过qiankun搭建微前端应用,以及完成子应用的任务管理界面和甘特图功能、文件上传这一块需求开发,在轻任务多维数据这一块主要负责个人代办事项和团队待办事项的开发,以及设计导入模板。
项目采用了模块化的设计和Websocket通信,提供强大的实时更新和协作能力,支持多种视图类型,包含个人待办事项、团队待办事项和模板库,通过引入自定义待办事项和丰富的模板库,提升用户在项目管理、数据分析和团队协作方面的效率。
我的第二段实习是在完美世界公司,主要负责游戏AI-Par ...
实习记录
AI-Partner
web端和小程序,小程序只有剧场内容
主题切换开发动态主题切换功能,利用 CSS 变量、SCSS 和 JavaScript 实现了用户在不同主题(如明暗模式)之间的无缝切换,确保跨设备和浏览器的兼容性,并通过性能优化提升了页面渲染速度,显著改善了用户体验。
主题切换的性能优化主要通过以下方式实现:
CSS 变量:使用 CSS 变量使主题切换更加高效,因为在切换主题时只需修改变量值,而无需重新加载或渲染整个样式表。这减少了样式应用的开销,提高了性能。
最小化重绘与重排:通过优化样式表的结构和避免不必要的 DOM 操作,减少了切换主题时的重绘和重排次数,从而提升了页面响应速度。
缓存机制:使用本地存储等方法保存用户的主题偏好,避免每次页面加载时都重新计算和渲染主题,进一步提升了加载速度。
这些方法共同作用,使得主题切换功能既快速又流畅。
谷歌登录+app.ts+user.ts
开发了一个 Vue 3 组件,实现了通过 Google 登录的功能。使用组合式 API 和 TypeScript,集成了 Google 的登录提示和回调处理。负责从 API 获取 ...
React面试题
函数组件和类组件React 中的组件有两种形式:函数组件(Functional Components)和类组件(Class Components)。虽然两者都可以用于构建 UI 组件,但它们有一些关键的区别和不同的使用方式。
函数组件(Functional Components)函数组件是 React 的一种轻量级组件形式,本质上是一个 JavaScript 函数,接收 props(属性)作为参数,并返回 JSX 来渲染 UI。
特点
定义简单:函数组件就是一个简单的 JavaScript 函数,不需要使用 this 关键字。
无状态(Stateless):在 React 16.8 之前,函数组件是无状态的,它们不能使用内部状态和生命周期方法。但是在 React 16.8 引入了 Hooks,现在函数组件也可以管理状态和执行副作用。
使用 Hooks:通过 useState、useEffect 等 Hooks,函数组件可以管理状态、执行副作用、访问上下文等,从而具备类组件的大部分功能。
1234567891011121314import React, { useState ...
浏览器原理
浏览器进程现代浏览器是一个多进程的应用程序,主要通过将不同的任务分配给不同的进程来提高性能和安全性。以下是浏览器中常见的几个进程及其功能:
浏览器主进程(Browser Process)
管理浏览器的用户界面,包括地址栏、书签栏、前进/后退按钮等。
协调与管理子进程(如渲染进程、网络进程等),包括进程的创建和销毁。
处理与文件系统的交互(如下载文件)。
管理浏览器窗口和标签页的生命周期。
处理浏览器的安全机制,比如同源策略、沙盒机制等。
渲染进程(Renderer Process)
渲染进程负责页面内容的渲染、布局和绘制,包括 HTML 解析、CSS 解析、JavaScript 执行、图片绘制等。
由于性能和安全的考虑,渲染进程运行在一个沙盒环境中,具有较低的权限,限制其对系统资源的访问,减少潜在的安全风险。
每个标签页或框架通常会拥有独立的渲染进程,这样可以隔离不同页面的运行,防止一个页面的崩溃影响其他页面。
渲染进程会与GPU 进程合作,进行页面的合成和绘制。
浏览器的渲染进程(Renderer Process)负责将网页的 HTML、CSS、JavaScript 解 ...
腾讯面经
instanceof的底层原理?在 JavaScript 中,instanceof 运算符是用来测试一个对象是否在其原型链中具有一个构造函数的 prototype 属性。
底层原理当你使用 instanceof 运算符时,JavaScript 会按照以下步骤进行:
获取原型:首先,instanceof 检查右侧运算符(通常是一个构造函数)是否具有 prototype 属性,然后获取这个属性的值,这个值应该是一个对象。
遍历原型链:接着,instanceof 会取左侧运算符(通常是一个对象)的原型,然后将这个原型与右侧的 prototype 进行比较。如果两者相等,返回 true。
原型链查找:如果第一次比较不相等,instanceof 则会继续查找左侧对象的原型的原型,重复这个过程,即向上遍历对象的原型链。
终止条件:这个过程会一直持续到对象原型链的末端。如果在原型链中找到了一个原型与右侧构造函数的 prototype 属性相等,instanceof 返回 true。如果遍历完整个原型链都没有找到相等的原型,最后返回 false。
示例代码12345678function ...
Javascript手写代码
参考:[https://juejin.cn/post/6844903911686406158]
继承原型链继承子类的原型被设置为父类的实例,从而使子类能够访问父类的属性和方法。
12345678910111213141516171819202122232425262728// 父类构造函数function Animal(name) { this.name = name; this.canWalk = true;}// 给父类原型添加方法Animal.prototype.eat = function() { console.log(this.name + ' is eating.');};// 子类构造函数function Dog(name, breed) { this.name = name; this.breed = breed;}// 子类继承父类Dog.prototype = new Animal();// 子类特有的方法Dog.prototype.bark = function() ...
Next.js学习之路
Next.js是基于React的开发框架Next.js 具有同类框架中最佳的开发人员体验和许多内置功能。列举其中一些如下:
直观的、 基于页面 的路由系统(并支持 动态路由)
预渲染。支持在页面级的 静态生成 (SSG) 和 服务器端渲染 (SSR)
自动代码拆分,提升页面加载速度
具有经过优化的预取功能的 客户端路由
内置 CSS 和 Sass 的支持,并支持任何 CSS-in-JS 库
开发环境支持 快速刷新
利用 Serverless Functions 及 API 路由 构建 API 功能
完全可扩展
Next.js 被用于数以万计的的网站和 Web 应用程序。
对包依赖管理工具的了解
npm
官方工具:是 Node.js 官方自带的包管理工具。
工作原理:每次安装依赖时,npm 会在项目目录中创建 node_modules 目录,并将所有依赖及其依赖的依赖都安装在该目录下。
性能:较早的版本安装速度较慢,但随着 npm 5+ 的发布,引入了锁文件(package-lock.json)和一些性能优化,速度有了明显提升。
使用简便:易于使用,适合初学者。
yarn
Facebook 开发:由 Facebook 开发,旨在解决 npm 的一些性能和安全问题。
工作原理:使用缓存机制,加快了依赖的安装速度。使用 yarn.lock 文件确保依赖的一致性。
并行安装:支持并行安装依赖,提升安装效率。
命令简洁:命令更加简洁易懂,例如使用 yarn add 替代 npm install。
pnpm
高效的存储机制:采用硬链接的方式,在全局存储中只保留一份包的实例,节省磁盘空间。
工作原理:使用 .pnpm 文件夹作为缓存,将所有依赖统一管理,避免重复安装。
快速安装:由于共享依赖,pnpm 通常比 npm 和 yarn 更快,特别是在有多个项目共享相同依赖的情况下。
严格的 ...
深入浅出设计模式
前言设计模式原则设计模式的基础是一些设计原则,这些原则为我们提供了编写可维护、可扩展和可重用代码的指导。这些原则尤其在面向对象设计中具有重要意义,帮助我们创建更灵活和更健壮的系统。以下是面向对象设计中常见的设计原则,它们是众多设计模式背后的核心思想:
xxxxxxxxxx //取消http代理git config –global –unset http.proxy//取消https代理 git config –global –unset https.proxyJS
定义:每个类应该只有一个引起它变化的原因,即类应该只有一个职责。
解释:一个类只负责完成一件事,如果一个类承担了过多的职责,当某个职责发生变化时,可能会影响其他职责,导致类变得复杂和难以维护。
好处:有助于简化代码,提升代码的可维护性和可读性。
例子:
如果一个类既处理用户数据的持久化(数据库操作),又负责用户界面的逻辑,那么它就违反了单一职责原则。可以将其拆分成两个类:一个负责数据库操作,一个负责 UI 逻辑。
开闭原则 (Open/Closed Princip ...