- 博客(14)
- 收藏
- 关注
RSS订阅原创 浏览器中JS的执行机制
变量提升先看段代码，你觉得下面这段代码输出的结果是什么？showName()console.log(myname)var myname = '张三'function showName() { console.log('函数 showName 被执行');}使用过 JavaScript 开发的程序员应该都知道，JavaScript 是按顺序执行的。若按照这个逻辑来理解的话，那么：当执行到第 1 行的时候，由于函数 showName 还没有定义，所以执行应该会报错；同样执行第 2
2021-09-23 17:23:06
259
原创 Vue深入学习之手写一个简单的Vuex
实现一个简单的vuex上篇文章 我们实现了一个i 拿单的vue-router，这一篇 我们趁热打铁 实现一个简单的vuex通过vuex的官网 我们知道vuex的作用Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。关键词 集中式 状态 可预测使用方法import Vue from 'vue'import Vuex from '../utils/gvuex'Vue.use(Vue
2021-07-29 13:52:28
145
原创 Vue深入学习之手写一个简单的Vuerouter
参照vue-router的使用方法// 0. 如果使用模块化机制编程，导入Vue和VueRouter，要调用 Vue.use(VueRouter)import Vue from 'vue'import VueRouter from 'vue-router'Vue.use(VueRouter)// 1. 定义 (路由) 组件。// 可以从其他文件 import 进来const Foo = { template: '<div>foo</div>' }const Bar
2021-07-18 00:42:46
104
原创 webpack 分享
webpack5.0简介：webpack是一个基于node.js的模块打包工具安装/卸载初始化目录（创建一个node的包文件）npm init //npm init -y 直接跳过询问全局安装cnpm install webpack webpack-cli -g查看是否安装成功webpack -v局部安装cnpm install webpack webpack-cli --save-dev查看是否安装成功npx webpack -v或者./node_modules/
2021-06-22 10:31:13
215
原创 2021-04-30
npm相关在这里插入代码片npm是一个包管理工具，开源作者可以把开源包发布在平台上供其他人下载使用。前端的同学基本都使用过npm，这里就不做过多介绍。日常工作中npm的主要用途就是根据项目的package.json使用npm install去安装依赖。npm install可以说是我们使用最频繁的一个指令。在npm5版本之前,npm install会根据package.json指定的依赖版本去进行安装。但往往package.json中指定的是一个版本范围，例“dependencies”: {“p
2021-04-30 10:10:14
69
原创 防抖和节流
一、前言以下场景往往由于事件频繁被触发，因而频繁执行DOM操作、资源加载等重行为，导致UI停顿甚至浏览器崩溃。window对象的resize、scroll事件拖拽时的mousemove事件射击游戏中的mousedown、keydown事件文字输入、自动完成的keyup事件实际上对于window的resize事件，实际需求大多为停止改变大小n毫秒后执行后续处理；而其他事件大多的需求是以一定的频率执行后续处理。针对这两种需求就出现了debounce和throttle两种解决办法.
2021-02-23 23:09:21
138
1
原创 This 指向问题
this指向问题事件调用谁触发事件，this指向谁 let content = document.getElementById('content'); let content1 = document.getElementById('content1'); let move = function(){ console.log(this) } content.onclick = move content1.onclick = move全局环境浏览器 :window
2021-02-21 00:49:00
78
原创 BFC/IFC
BFC定义BFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。A block formatting context contains everything inside of the element creating it that is not also inside a descendant element t
2021-01-08 20:32:44
312
1
原创 2021-01-06
CSS Grid 网格布局网格布局（Grid）是最强大的 CSS 布局方案。它将网页划分成网格，可以任意组合不同的网格，做出各种各样的布局。以前，只能通过复杂的 CSS 框架达到的效果，现在浏览器内置了。上图这样的布局，就是 Grid 布局的拿手好戏Grid 布局与 Flex 布局有一定的相似性，都可以指定容器内部多个项目的位置。但是，它们也存在重大区别。Flex 布局是轴线布局，只能指定"项目"针对轴线的位置，可以看作是一维布局。Grid 布局则是将容器划分成"行"和"列"，产生单元格，然后指
2021-01-08 19:49:02
104
原创 2020-12-30
web 安全跨站脚本攻击XSS简介Cross-Site Scripting（跨站脚本攻击）简称 XSS，是一种代码注入攻击。攻击者通过在目标网站上注入恶意脚本，使之在用户的浏览器上运行。利用这些恶意脚本，攻击者可获取用户的敏感信息如 Cookie、SessionID 等，进而危害数据安全。原理危害获取页面数据获取cookie改变页面逻辑发送请求获取用户数据 获取用户登录态分类类型位置危害存储型URL大反射型后端数据库小反射型http:/
2021-01-07 19:37:10
64
原创 webpack4.0从入门到入门（02-1常用loader）
loaderswebpack不能识别非js结尾的文件，loader是一种打包方案，定义不同的文件应该如何打包。常用loaderfile-loader作用：用来处理图片字体等文件原理：将文件移动到打包后的文件夹（dist）中，并返回文件名称。module.exports = { module: { rules: [ { test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, loader: 'file-loader',
2020-06-28 20:27:48
189
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人