- 博客(20)
- 收藏
- 关注
RSS订阅原创 html、css面试题总结
html面试题：1.如何理解HTML语义化：语义化就是标题是标题（h1），列表是列表（ui、li），而不是全部用div包裹起来让人更容易读懂(增加代码可读性)让搜索引擎更容易读懂(SEO)2.块状元素&内联元素？display：block/table;如：div h1 h2 table ul ol p 等display:inline/inline-block; 如 span img input buttion 等css知识模块大概分为五部分：一.布局1.盒模型宽度计算：
2021-03-01 14:15:34
133
原创 Virtual DOM的实现原理
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !Virtual DoM什么是Virtual DoM
2021-01-08 16:27:26
208
原创 模拟Vue.js响应原理
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !准备工作数据驱动响应式的核心原理发布订阅模式和观察者模式数据驱动数据响应式、双向绑定、数据驱动数据响应式 数据模型仅仅是普通的 JavaScript 对象，而当我们修改数据时，视图会进行更新，避免了繁 琐的 DOM 操作，提高开发效率双向绑定1.数据改变，视图改变；视图改变，数据也随之改变2.我们可以使用 v-model 在表单元素上创建双向数据绑定数据驱动是 Vu.
2020-12-30 17:43:08
157
1
原创 Vue-Router原理实现
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !vue.js基础回顾1.vue.js基础结构：vue内部会把data中的数据填充到el指向的模板中，并把模板渲染到浏览器。render方法接收一个参数，这个参数是h函数，用来创建虚拟dom，render方法把创建的虚拟dom方法返回。$mount方法把虚拟dom转换成真实dom，渲染到浏览器。...
2020-12-26 23:41:12
172
3
原创 规范化标准之eslint、stylelint
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !规范化标准为什么要有规范化标准？软件开发需要多人协同；不同开发者具有不同的编码习惯和喜好；不同的喜好增加项目维护成本；每个项目或者团队需要明确统一的标准。哪里需要规范化标准代码、文档、甚至是提交日志；开发过程中人为编写的成果物；代码标准化规范最为重要实施规范化的方法编码前人为的标准约定；通过工具实现 Lint (通过工具找到代码中不规范的过程)ESLint最为主流的 J.
2020-12-24 16:04:47
800
原创 模块化开发与规范化标准(Webpack打包2)
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !** 一、Webpack 自动刷新**HMR模块热替换:应用过程中实时替换某个模块，而应用运行状态不受影响。HMR 极大程度的提高了开发者的工作效率，因此很受欢迎。开启HMRHMR集成在webpack-dev-server中，无需再单独安装模块。1.直接在命令中，使用 --hot 开启热更新yarn webpack-dev-server --hot2.在 webpack.config.js 中，.
2020-12-22 18:37:01
160
原创 模块化开发与规范化标准(Webpack打包1)
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !模块打包工具一、模块打包工具的由来随着引用模块化，我们的应用会产生新的问题：1.ES Modules 存在环境兼容问题2.模块文件过多，网络请求频繁(每一个我们需要请求的文件都要从网络请求当中请求回来，影响工作效率)3.所有的前端资源都需要模块化毋容置疑，模块化是必要的将所有es 6和一些新特性的代码转化为浏览器均能兼容运行的代码，以及能将所有散落的文件全部打包到一个文件里，支持不同类型的资源模块.
2020-12-21 18:40:31
641
原创 模块化开发与规范化标准(模块化开发)
一、模块化开发模块化开发概述随着前端应用复杂，我们的项目的代码已经逐渐膨胀到不得不花大量时间管理程度，而模块化是最主流的代码组织方式，它通过把我们的复杂代码按照功能不同分为不同的模块，然后单独维护的这种方式去提高我们的开发效率，降低维护成本，模块化只是一个思想或者理论，并不包含实现。以下介绍我们模块化的主流方式模块化的演进过程早期第一阶段，我们JavaScript的模块化实际上是基于文件划分的方式去实现的，这也就是我们web当中最原始的模块系统。将每一个功能以及相关的一些状态数据单独存放在不
2020-12-16 16:55:11
686
原创 自动化构建与grunt
一、自动化构建简介:自动化指的是机器代替手工完成工作，构建可以理解为转换，就是把一个东西转换为另外的一些东西。总的来说自动化构建就是把开发阶段写出来的源代码自动化去转换成生产环境当中可以运行的代码或者程序，这样的转行的过程称为自动化构建工作流，这样做是尽可能让我们脱离运行环境兼容带来的问题。在开发阶段去使用一些提高效率的语法、规范和标准，比如开发网页应用时，可以运用ECMAScript NEXT提高编码效率和质量，利用sass增强css的可编程性，再去借助模板引擎抽象页面中重复的html，这些用法.
2020-12-14 10:30:54
200
原创 gulp的基础使用与模块发布
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !一、自动化构建简介:自动化指的是机器代替手工完成工作，构建可以理解为转换，就是把一个东西转换为另外的一些东西。总的来说自动化构建就是把开发阶段写出来的源代码自动化去转换成生产环境当中可以运行的代码或者程序，这样的转行的过程称为自动化构建工作流，这样做是尽可能让我们脱离运行环境兼容带来的问题。在开发阶段去使用一些提高效率的语法、规范和标准，比如开发网页应用时，可以运用ECMAScript NEXT提...
2020-12-11 18:46:55
359
原创 前端工程化概述与脚手架工具
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !一、工程化的定义和主要解决的问题从传统的网站到现在的H5，移动app，桌面应用以及小程序，前端对开发人员的要求发生了翻天覆地的变化。面临的问题想要使用ES6+,但是兼容有问题(传统语言或语法的弊端) 想要使用Less/Sass/PostCSS增强CSS的编程性，但是运行环境不能直接支持(无法使用模块化/组件化) 部署上线前需要手动压缩代码及资源文件，部署过程需要手动上传代码到服务器(重...
2020-12-02 15:52:38
263
2
原创 JavaScript性能优化2(代码优化)
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !一、JSBench使用相对于JSperf，JSBench(https://jsbench.me/)综合性能更强.Teardown:做一个收尾的工作，比如我们连接完数据库之后，如果操作完了数据，我们就应该把这个连接释放掉。正常来讲，我们js代码执行完之后，可能我们调用的函数操作都是一样的，没必要写在用例里面，所以把他们抽离出来放到Teardown里面用就可以了。测试的时候尽量只开一个标签...
2020-11-30 16:47:43
108
原创 JavaScript性能优化(内存管理中的代码优化)
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !一、避开闭包陷阱闭包特点外部具有指向内部的引用 在‘‘外’’部作用域访问“内部”作用域的数据function foo(){ var name = 'lg' function fn(){ console.log(name) } return fn}var a = foo()a()闭包是一种强大的语法 闭包使用不当很容易出现内存泄漏，...
2020-11-27 17:39:00
297
原创 JavaScript性能优化(performance与内存管理)
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !一、Performance为什么使用PerformanceGC的目的是为了实现内存空间的良性循环 良性循环的基石是合理使用 时刻关注才能确定是否合理 Performance提供多种监控方式Performance使用步骤打开浏览器输入目标网址 打开开发人员工具面板，选择性能 开启录制功能，访问具体页面 执行用户行为，一段时间后录制，然后结束录制，点击performance按钮查看内...
2020-11-27 09:59:52
743
原创 JavaScript中的性能优化1
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !本文章内容:内存管理 垃圾回收与常见GC算法 V8引擎的垃圾回收 performance工具 代码优化实例一、内存管理 内存:由可读写单元组成，表示一片可操作空间 管理:人为的去操作一片空间的申请、使用和释放 内存管理:开发者主动申请空间、使用空间、释放空间 管理流程:申请-使用-释放 JavaScript中的内存管理申请内存空间 使用内存空间..
2020-11-25 15:56:03
81
原创 迅速了解TypeScript1
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !一、 TypeScript快速上手安装TypeScriptyarn init --yes # 初始化项目目录yarn add typescript --dev # 开发依赖安装到本项目上新建TypeScript文件，文件名01-getting-started.ts,其文件扩展名默认为 .ts// 可以完全按照 JavaScript 标准语法编写代码const hello = (na..
2020-11-24 10:16:05
142
原创 TypeScript前奏
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !TypeScript可大大提高代码的可靠程度。该系列文章主要介绍:强类型与弱类型 静态类型与动态类型 JavaScript自有类型系统问题 Flow静态类型检查方案 TypeScript语言规范与基本应用一、类型系统：强类型与弱类型 强类型与弱类型(类型安全的角度):语言层面限制函数的实参类型必须与形参类型相同 class Main{ static void foo(int..
2020-11-21 12:40:08
96
1
原创 ECMAScript 新特性3
一、Symbol Symbol数据类型表示一个独一无二的值，可以用来避免对象属性名重复的问题，还可以借助这种特性模拟对象的私有成员 console.log(Symbol() === Symbol()) //false//================================================const obj = {}obj[Symbol()] = '123'obj[Symbol()] = '456'console.log(obj) //{[Symbol()..
2020-11-19 17:22:56
113
原创 ECMAScript 新特性2
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢 !一、 ES2015字符串的扩展方法startsWith() .endsWith() .includes()const message = 'Error:foo is not defined.'console.log( // message.startsWith('Error') // message.endsWith('.') // message.includes('.
2020-11-17 21:57:22
91
原创 ECMAScript 新特性1
文章说明：本文章为拉钩大前端训练营所做笔记和心得，若有不当之处，还望各位指出与教导，谢谢一、ECMAScript概述ECMAScript也是一门脚本语言，一般缩写为ES，通常把他看做JavaScript的标准化规范，实际上JavaScript是ECMAScript的扩展语言。ECMAScript当中只提供了最基本的语法。JavaScript实现了ECMAScript语言标准，并且在这个基础之上做了扩展：web环境下：Node环境下：JavaScript语言本身指的就是EC...
2020-11-15 23:33:24
91
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人