- 博客(23)
- 收藏
- 关注
原创 前端html是什么?html5、css3是什么?
网页的构成网页由结构(html)、表现(css)、行为(javascript)组成。什么是html?HTML 指的是超文本标记语言 (Hyper Text Markup Language) www万维网的描述性语言。html的语法:常规标记(双标记):<标记名称 属性1名=“属性1值” 属性2名=“属性2值” ………… ></标记名>空标记(单标记):<标记名 属性1名=“属性1值” />书写结构<!DOCTYPE html>&
2020-09-30 17:59:49 925
原创 提高webpack的打包速度方法
如何提升webpack打包速度1.跟上开发技术的迭代Node、Yarn、Npm、Webpack保持最新最稳定的版本2.在尽可能少的模板上使用loader合理的使用exclude或者include的配置,来尽量减少loader被频繁执行的频率。当loader执行频率降低时,也会提升webpack的打包速度。比如:module: { rules: [{ test: /\.js$/, include: path.resolve(__dirname, '../sr
2020-10-23 09:01:30 1744
原创 Babel的工作原理 h5页面通过浏览器怎么渲染的?
babel的工作原理babel的包构成核心包babel-core:babel转译器本身,提供了babel的转译API,如babel.transform等,用于对代码进行转译。像webpack的babel-loader就是调用这些API来完成转译过程的。babylon:js的词法解析器babel-traverse:用于对AST(抽象语法树,想了解的请自行查询编译原理)的遍历,主要给plugin用babel-generator:根据AST生成代码babel的工作原理babel是一个转译器,感觉
2020-10-22 19:36:37 391 1
原创 webpack.config.js中的css样式、sass、打包抽离,浏览器加前缀(兼容),图片文件处理,ES6处理
webpack.config.js中的css样式、sass、打包抽离,浏览器加前缀(兼容),图片文件处理,ES6处理1.安装css和style插件yarn add style-loader css-loaderindex.cssbody{ background:skyblue;}将样式引入js文件//引入样式require('./index.css')console.log(2+2)在webpack.config.js中配置文件module.exports内添加:
2020-10-22 15:09:46 275
原创 webpack打包工具与gulp 安装与使用详细
Webpack概念?webpack 是一个模块打包工具。webpack是基于配置的,通过配置一些选项来让webpack执行打包任务四个核心概念:入口(entry)输出(output)loader插件(plugins)用处?打包:将多个js文件打包成一个文件 (1.减少Http请求 2.压缩页面的空格从而减轻服务器压力)转换:把扩展的语法转换成普通js , 目的就是让浏览器正常解析运行代码(es6解析)优化:复杂的开发流程 、进行模块化打包、去空格、压缩混淆、减少http请求
2020-10-22 14:15:54 308
原创 路由懒加载 路由模式 路由守卫
路由懒加载 懒加载也叫延迟加载,即在需要的时候进行加载,随用随载。在单页应用中,如果没有应用懒加载,运用webpack打包后的文件将会异常的大,造成进入首页时,需要加载的内容过多,延时过长,不利于用户体验,而运用懒加载则可以将页面进行划分,需要的时候加载页面,可以有效的分担首页所承担的加载压力,减少首页加载用时。路由模式hash模式原理:调用window.onhashchange方法hash值的切换history模式原理:本质使用H5的histroy.pushState方法来更改urlhash与
2020-10-16 17:05:25 222
原创 vue生命周期钩子函数 面试必问 组件初始化、运行中、销毁......
生命周期钩子函数组件从创建到销毁的一系列过程叫做组件的声明周期。vue在整个生命周期里面提供了一些函数,可以在内部实现一些业务逻辑,并且这些函数会在一些特定的场合下去执行。(在生命周期的某一个时刻进行触发) 组件的生命周期大体可以分为三个阶段: 初始化、运行中、销毁 初始化阶段:beforeCreate created beforeMount (render) mounted 运行中阶段:beforeUpdate updated
2020-10-13 20:52:07 1952
原创 虚拟dom怎么理解?and prop验证
虚拟dom1.在内存中生成一个虚拟dom树2.初始化渲染成真实dom(浏览器可见)3.修改数据4.将修改后的数据结合之前的dom树,生成新的虚拟dom树5.将新的虚拟dom树和之前的虚拟dom树进行diff算法对比出最小差异6.再去将对比后的差异进行真实dom渲染prop验证props的值可以是对象,在里面可以对父组件传过来的数据做出验证,如果验证失败,会抛出警告如果子组件没有通过props来接收父组件传递的某个数据,该属性就会出现在子组件模板的最外层节点上面(组件
2020-10-13 20:48:29 149
原创 vue面试题、react面试题大全、ES6等....
自己整理的一些面试题:1、promise是用来做什么的?答:它是一个对象,用来传递异步操作的信息。2、promise三个状态?Pending:进行中,Resolved:已完成,Reject:已失败3、promise优缺点?优点:可以通过.then解决回调地狱的问题,通过try-catch解决问题捕获数组去重的常用方法1.es6的set方法var arr = [1,1,8,8,12,12,15,15,16,16];function unique (arr) { retu
2020-10-09 20:33:18 4886 1
原创 计算属性computed的使用,watch?
watch和computed需求: 做一个值是num值的2倍的关系methods: 1.{{num*2}} 可以实现这个功能效果 发现不方便进行管理 2.可以把多次重复的一些代码封装成一个函数进行调用 发现页面中如果使用了无关数据的话,当无关数据发生改变的时候,这个doubleNum方法也会被调用,重新计算结果 3.可以通过watch监听器来去实现效果。
2020-10-08 22:49:24 131
原创 数组的更新检测
数组的更新检测Vue 将被侦听的数组的变更方法进行了包裹,所以它们也将会触发视图更新。这些被包裹过的方法包括: push() 数组的后面插入元素 pop() 从数组的后面删除一个元素 shift() 从数组的前面删除一个元素 unshift() 从数组的前面插入一个元素 splice()
2020-10-07 14:09:22 225
原创 vue中的指令v-for循环遍历、v-if条件判断v-show,v-on事件监听、事件修饰符
vue中的条件渲染v-else-if当有else分支逻辑的时候,可以给该元素加上v-else指令来控制,v-else会根据上面的那个v-if来控制,效果与v-if相反,注意,一定要紧挨着还有v-else-if指令可以实现多分支逻辑在元素上使用v-if条件渲染分组根据表达式的值true或false在DOM中生成或者移除一个元素(或多个元素)。有点类似JavaScript中的if条件判断。在Vue中除了v-if也有v-else-if和v-else之类;在元素上使用v-show条件渲
2020-10-03 21:02:07 4489
原创 一、mvc模式和mvvm模式
学习vue的基本语法mvc和mvvm的关系图解mvc:M - Model :数据保存V - View : 用户界面C - Controller : 业务逻辑MVC ,用户操作> View (负责接受用户的输入操作)>Controller(业务逻辑处理)>Model(数据持久化)>View(将结果通过View反馈给用户)MVC是最经典的开发模式之一,最早是后台那边来的,后台前端的复杂度也上来了,MVC的开发模式也带进前端了众所周知,MVC是开发客户端最经典的设计模
2020-10-03 13:02:08 263
原创 正则表达式的方法?元字符?
正则表达式声明正则表达式正则表达式,功能貌似和字符串差不多。正则表达式,叫做superstring,正则功能比字符串强大的多。正则声明正则的声明 1、通过new声明 2、省略new声明 3、通过正则常量赋值 第一个参数:正则主体部分 第二个参数:修饰符 i 忽略大小写 g 全局匹配 m 换行匹配
2020-09-30 08:43:37 117
原创 事件是什么?事件类型都包括?绑定事件?
事件什么是事件?事件是有两个部分组成1、事件发生了2、针对于这个事件,做出处理。 事件处理的行为一定是实现约定好的。 【注】这个约定的方式叫做 事件绑定。 事件绑定的两种方式 1、内联 2、外联/脚本模式 【注】一般情况下选择第二种。绑定事件function btnClick() { alert("我是内联模式"); } window.onload = function () {
2020-09-29 21:09:11 1999
原创 对象是什么?能吃吗?对象的用法
对象认识对象1、历史 面向过程编程语言:汇编 C语言 面向对象编程语言:javascript java python php2、编程思想: 面向过程编程思想:只关心数学逻辑。 面向对象编程思想:直接将生活逻辑映射到我们的程序。 步骤: 1、找出实体 2、分析实体的属性和功能 3、让实体之间相互作用,最后得出结果。var car = { speed:60,
2020-09-28 21:08:14 551
原创 字符串的使用方法攻略
字符串的使用方法charAt 找到索引对应的内容定义:找到字符串中指定索引位置对应的内容返回。(如果对应索引没有内容,返回一个空字符串)var str = 'Jack'// 使用 charAt 找到字符串中的某一个内容var index = str.charAt(2)console.log(index) // cvar str = 'Jack'// 使用 charAt 找到字符串中的某一个内容var index = str.charAt(10)console.log(
2020-09-28 21:07:02 299
原创 冒泡排序和ES5常用的方法
数组的排序冒泡排序先遍历数组,让挨着的两个进行比较,如果前一个比后一个大,那么就把两个换个位置数组遍历一遍以后,那么最后一个数字就是最大的那个了然后进行第二遍的遍历,还是按照之前的规则,第二大的数字就会跑到倒数第二的位置以此类推,最后就会按照顺序把数组排好了规则:前后两个数两两进行比较,如果符合交换条件,就交换两数的位置。 特殊:每一轮比较完成以后,都会找到一个较大的数,放在正确的位置。 第一轮:五次 9, 8, 7, 6, 5, 4
2020-09-28 21:05:28 152
原创 循环函数:while循环和for循环及函数定义
循环while循环while循环语法:while(循环条件){循环语句;} 循环的好处: 1、代码不冗余 2、结构简洁 3、代码复用 4、后期维护成本比较低 编写循环: 1、确定计数 2、每次让计数累增 3、仔细
2020-09-28 21:04:05 7574
原创 各类运算符及分支语句
运算符数学运算符有一套规律:1. 任何类型的数据和字符串类型的数据做相加(+)操作时,其他数据类型会自动的转换为字符串类型。此时的相加(+)不再是数学意义上的加法,而是表示“拼接”的意思。2. 任何数据除了和字符串做相加运算外,字符串转成数字。与NaN做算术运算的结果始终都是NaN。包括NaN本身和NaN做运算的结果也是NaN。(字符串是数值会自动的转换为数字,否则会转换为NaN)3. 任何其他数据除了字符串以外,与数字类型做算术运算时,其他数据会自动的转换为数字。(true会自动的转换为1
2020-09-28 21:01:32 185
原创 JS是什么?变量及数据类型?
JavaScript超神之路开启js是什么?HTML 标记语言JaveScript 编程语言JaveScript 是一个面向对象的跨平台脚本语言(高级编程语言 行为)JaveScript能干什么?1.网页效果(表单验证,轮播图)2.与h5配合游戏(切水果)3.实现应用级别的程序4.实现统计效果5.地理位置地图6.在线学编程游戏(https://www.yuque.com/tianyufei/wzeua5/rrdxqa)7.人工智能(人脸识别)JS的组成ECMAScript:定
2020-09-28 20:54:58 321
原创 React从入门到放弃 新手入门必备
Reactreact的特点react特点: 2013.5 facebook 16.13.1版本 fiber协调算法 采用分片思想 解决组件同步的更新导致浏览器卡顿问题 声明式 组件化 一次学习,随处变化 vue是一个完整的mvvm框架,react只是一个mvc中的view视图层框架简单的hello world案例 npm init -y 创建一个package.json配置文件 npm i react react-dom babel-stan
2020-09-28 17:58:36 195
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人