- 博客(29)
- 收藏
- 关注
原创 服务端渲染及Vue版本控制
转载:Vue版本区别vue cli创建的项目默认使用vue的runtime版本。vue cli对webpack深度封装,可使用vue inspect > xxx.js将配置导出到某一文件中查看。
2022-07-20 21:24:07
498
1
原创 数据存储及对象拷贝
基本数据类型以值的方式存储在内存中而对象在存储的是地址。在一处修改对象中的值在每个调用的地方都会修改。可以通过拷贝的方式创建新的对应关系。大多数情况下存储数据的对象会遇到拷贝需求(数据中没方法)数组拷贝浅拷贝:只拷贝当前对象自身的属性(第一层),对属性的属性无法实现完全拷贝方式一、遍历数组依次赋值const arr1 = [1,2,3,['a','b','c']]const arr2 = []for(let i=0; i<arr1.length; i++){ arr2.push(ar
2021-08-30 13:23:32
91
原创 Vue进阶及原理
一、数据绑定原理Object.defineProperty()方法参数1:操作的对象参数2:操作对象的名称参数3:对属性的描述var obj = {name: 'zs', age: '18'}Object.defineProperty(obj, gender, { value: '男', writable: false //默认false 不可写 enumerable: false //默认false不可枚举(遍历) configurable: false //默认false
2021-08-24 07:28:04
168
原创 浏览器工作原理之网络传输及界面显示
浏览器工作原理浏览器进程:打开一个浏览器会至少开启四个进程,1 个浏览器(Browser)主进程、1 个 GPU 进程、1 个网络(NetWork)进程、多个渲染进程和多个插件进程从输入请求到页面渲染浏览器在网络传输过程中使用的是TCP协议发送HTTP请求。是由于TCP引入了数据包的排序机制,能够把乱序的数据包组合成一个完整的文件。......
2021-08-19 07:29:07
487
原创 Vuex 基础
Vuex作用:为Vue.js开发的状态管理工具,集中式存储管理应用的所有组件的状态,实现不同组件之间数据传递。npm i vuex --savestorestore中的数据可以共享给其他任意位置,在调用时使用$store.state访问store中的数据Mutation唯一可以修改Vuex中store状态的方法,不能处理异步操作,按照调用顺序或者commit提交的顺序触发事件。调用mutition方法需要使用store.commit 方法。利用actions属性可以实现异步处理const sto
2021-07-21 02:20:56
59
原创 WebComponents
WebComponents介绍及使用CustomElementRegistry接口提供注册自定义元素和查询已注册元素的方法。使用 window.customElements属性可以自定义标签,扩展内置标签的功能。<!--调用自定义标签--><demo-element></demo-element><!--调用基于内置元素创建的自定义元素--><p is="demo-element"></p><script>/
2021-06-18 09:31:09
124
原创 Vue Router源码分析
Vue RoterVue Router 是Vue.js的官方插件,用来快速实现单页应用单页应用优点:前后端分离开发,提高开发效率、业务场景切换时,局部更新结构、用户体验好,接近本地应用缺点:不利用SEO、初次首屏加载速度慢、页面复杂度高前端路由...
2021-06-07 21:12:40
378
原创 Vue组件化开发
组件化开发组件用于分装页面的部分功能,将功能的结构、样式、逻辑代码封装起来,提高功能否对复用性和可维护性,更专注业务逻辑的开发。组件注册组件本质上时可复用的Vue实例,可以与new Vue接收相同的选项,例如data、methods以及生命周期钩子等。命名规则全局注册可以用于任意实例或组件中,必须创建于根Vue实例创建之前Vue.component('组件名',{选项对象}) <div id="app"> <my-component></my-comp
2021-05-27 23:49:56
226
原创 Promise、Async、await使用及源码
作用:多个具有依赖关系的异步任务状态明确之后无法更改<script> new Promise(function(resolve,reject){ })</script>
2021-05-26 09:03:28
232
原创 Vue.js
数据驱动视图通过对数据的逻辑修改,数据变化会更新到视图中,简化DOM操作(单向数据绑定)。基于MVVM实现组件化开发允许将网页功能封装成自定义HTML标签,复用时书写自定义标签名即可.........
2021-05-17 09:32:54
201
原创 使用html-webpack-plugin 插件报错问题解决方案
使用webpack在构建HTML时需要安装并且使用html-webpack-plugin 插件但是在构建过程中会报错报错信息如下:TypeError: Cannot read property ‘tap’ of undefinedat HtmlWebpackPlugin.apply (D:*\node_modules\html-webpack-plugin\index.js:40:31)at webpack (D:*\node_modules\webpack\lib\webpack.js:51:.
2021-04-21 00:10:18
3777
原创 模块化开发
基础介绍Modules特性通过给script添加type = module属性,可以以ES Module 的标准执行其中的JS代码。每个ES Module都是运行在单独的私有作用域中,this指针不能在全局范围内使用。<script type = 'module'> console.log(this) //不可访问</script>ESM 是通过CORS的方式请求外部JS模块,请求的地址支持CORS才可以访问ESM 的script 的标签会延迟执行的脚本添加ty
2021-04-12 18:27:51
59
原创 Gulp使用介绍
GulpGulp是基于流的构建系统流是异步操作,不需要回调函数(Gulp有一个自己的内存,通过指定 API 将源文件流到内存中,完成相应的操作后再通过相应的 API 流出去)使用步骤:使用 Gulp 之前,先在全局安装 gulp-cli// 卸载 gulp 命令 npm rm -g gulp-cli// 安装 gulp 命令行工具 npm i -g gulp-cli// 验证安装是否成功 gulp -v初始化项目//创建项目目录mkdir project-name//
2021-04-12 09:25:23
279
原创 Node.js
一、Node.js 基础Node不是一个新语言或技术,而是一个基于 Chrome V8 引擎 的 JavaScript运行环境1.1全局对象和全局函数global 在脚本模式下,申明的变量和函数都不属于全局对象global立即执行定时器(setImmediate/clearImmediate)...
2021-03-31 18:14:00
100
原创 Git使用
Git 的使用配置用户名和邮箱git config --global user.name "hygd"git config -- global user.email "email url"初始化命令
2021-03-30 11:04:51
118
原创 AJAX
一、AJAX概述:浏览器提供的API,通过js调用。通过代码控制请求与响应,实现通过JS网络编程作用:页面局部更新,提高加载速度1.1原生AJAX发送ajax请求步骤:1.创建XMLHttpRequest类型对象2.准备发送,打开与一个网址之间的连接3.执行发送动作4.指定xhr状态变化事件 处理函数//1.创建XMLHttpRequest类型对象var xhr = new HttpRequest();//2.打开与一个网址之间的连接,相当于输入链接xhr.open("GET","ht
2021-03-18 01:23:55
97
原创 JS数组去重方法
数组去重1.利用ES6 Set去重(ES6中最常用)function unique(arr) { return Array.from(new Set(arr))}var arr = [1, 1, 'true', 'true', true, true, 15, 15, false, false, undefined, undefined, null, null, NaN, NaN, 'NaN', 0, 0, 'a', 'a', {}, {}];console.log(unique(arr))
2021-03-18 00:07:11
54
原创 H5+CSS3
HTML+CSS1.html基本骨架1.1文档类型声明<!DOCTYPE html>//html5版本特有<html lang="zh-CN"> //语言:可以是en代表英文,浏览器解析时会提示是否翻译成中文<mate chsrset="UTF-8">//字符集UTF-8或gb2312或gbk(增加繁体字是gb2312的扩展)注:UTF-8中的汉字占3个字节而gdk汉字占两个字节。网站中有大量汉字且对网页加载速度有要求使用gbk编码<mate nam
2021-03-17 23:59:15
1375
原创 jQuery
一、jQuery1.1 $()使用(".box")或者(".box")或者(".box")或者("#box")获取元素选用JQ以后不能直接使用原生JS对象的方法1.2 jQuery与原生对象的转换jQ转原生:直接利用数组下标 $ps = $("p")[0]原生转JQ:加$()p = document.getElementTagName("p")[0];$(p).css("background-color","skyblue")$(p).html("使用jQ修改html内容")
2021-03-14 12:36:26
639
原创 JS
1.JS基本语法1.1 变量1.1.1 JS语句弹框警示:alert(“警告”);提示:prompt(“请输入年龄”,“18”);控制台打印输出:console.log("");1.1.2定义变量使用var关键字定义变量 var a定义变量默认为undefined类型`var a = 1 , b = 2 , c = a + b;检测数据类型:typeof(NaN); typeof(Infinity); typeof(Null);结果:number number object
2021-01-29 01:23:21
106
原创 JsAPIs
一、DOM学习文档:MDN概念:Document Object Model文档对象模型作用:简化对页面的操作动态访问程序和脚本常用功能:获取元素;对元素操作;动态创建元素;事件console.dir(); 控制台打印具体对象1.获取元素1.1 根据id获取元素方法: 调用document对象的getElementByld方法参数:字符串类型的id的属性值返回值:对应id名的具体元素对象。注意:js在html之前,导致结构未加载,不能获取id元素<p id="para"&
2021-01-29 01:22:47
333
原创 Java数组及内存分配
Java数组及内存分配一.Java数组对于Java数组的初始化,主要有三种方式1.静态初始化在数组定义的时候直接为数组赋值,将内容放入为其申请的空间中int[] a={1,2,3,4}//数组a一旦定义长度就不可改变;String[] Array01={"aa","bb","bd"};//数组中的数据类型必须完全相同Men[] Mens={new Men(),new Men()}//也可以通过new来创建2.动态初始化动态初始化时首先为数组申请内存空间int[] b=new int[
2020-09-11 23:31:36
242
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人