任性的wo的博客

原创 对象补充-原型和函数原型-创建对象

分别不注释Object.seal(obj)和注释Object.seal(obj)的结果。2、禁止对象扩展新属性：preventExtensions。函数原型上的属性-constructor。规范：构造函数的首字母一般是大写。3、禁止对象配置/删除里的属性。创建对象方案-原型和构造函数。1、获取对象的属性描述符。4、让属性不可以修改。

原创 with-eval-严格模式-面向对象

可以形成自己的作用域 eval是一个特殊的函数，它可以将传入的字符串当作JavaScript代码来运行开启严格模式 那么如何开启严格模式呢？严格模式支持粒度话的迁移 严格模式限制面向对象是现实的抽象方式JavaScript的面向对象 对对象属性的操作 参考文档：Object.defineProperty() - JavaScript | MDNObject.defineProperty() 方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象。https://develope

原创 纯函数-柯里化实现-组合函数

函数式编程中有一个非常重要的概率叫纯函数，JavaScript符合函数式编程的范式，所以也有纯函数的概念纯函数的维基百科定义：总结：副作用在计算机科学中，在执行一个函数时，除了返回函数值之外，还对调用函数产生了附加的影响，比如修改了全局变量，修改参数或者改变外部的存储纯函数的优势柯里化也是属于函数式编程里面一个非常重要的概念总结： 柯里化的结构 简化柯里化的代码柯里化的作用：让函数的职责单一逻辑的复用柯里化的实现理解组合函数简单的组合函数 通用的组合函数的实现：...

原创 apply-call-bind实现-参数解析

手写实现一个call方法手写实现一个apply手写实现一个bind 精简版： 认识argumentsarguments是一个对应于传递给函数的参数的类数组（array-like）对象将argumens转成array类型箭头函数中没有arguments...

原创 闭包内存回收和this的四个绑定规则

闭包内存泄漏的案例：在内存的表现： 销毁数据，避免内存泄漏的操作：代码： 没有使用的age属性，js引擎会销毁这个age属性为什么需要this？有了this，我们编写代码更加方便this在全局环境的指向：在函数中使用：this指向什么，跟函数所处的位置是没有关系的，跟函数被调用的方式是有关系 默认绑定独立函数调用隐式绑定调用方式是通过某个对象进行调用的 显示绑定call和apply有什么区别 call和apply在执行函数时，是可以明确的绑定this，这个绑定规则称之为显示绑定

原创 闭包的定义-理解-内存模型-内存泄漏

闭包如果一个函数用到了它作用域外面的变量，那么这个变量和这个函数之间的环境就叫闭包。闭包的用途：模仿块级作用域 存储变量 封装私有变量JS中函数是一等公民在JavaScript中，函数是非常重要的，并且是一等公民那么就意味着函数的使用是非常灵活的 函数可以作为另外一个函数的参数，也可以作为另外一个函数的返回值来使用自己编写高阶函数 使用内置的高阶函数函数和方法的区别：函数function：独立的function，那么称之为是一个函数function foo() {

原创 函数执行-作用域-面试题-内存管理

原创 浏览器原理-v8引擎-js执行原理

当拉取到js、css等资源后就通过浏览器内核来解析 浏览器内核指的是浏览器的排版引擎：排版引擎（layout engine），也称为浏览器引擎（browser engine）、页面渲染引擎（rendering engine）或样板引擎浏览器渲染过程在这个执行过程中，HTML解析的时候遇到了Javascript标签，会停止解析HTML，而去加载和执行Javascript代码Javascript代码由谁来执行：JavaScript引擎为什么需要JavaScr...

原创 前端工作过程遇到的问题总结(九)

JS中every()和some()的用法every()：是对数组中每一项运行给定函数，如果该函数所有一项返回true,则返回true。一旦有一项不满足则返回flasesome()：是对数组中每一项运行给定函数，如果该函数满足任一项返回true，则返回true用法：可以用在数据过滤或者数据判断置换元素和非置换元素转载原文章地址：HTML中的置换元素(替换元素)和非置换元素(不可替换元素)_eeeecw的博客-CSDN博客_置换元素什么是置换元素“置换元素”又叫做“替换元素”，.

原创 前端知识资源分享

前段时间在哔哩哔哩上刷到了一个资源分享的博主，做一个前端学习资源总结，有兴趣学习的小伙伴去看看哔哩哔哩的博主地址：技术胖的个人空间_哔哩哔哩_Bilibili前端知识总结：前端知识图谱+B站视频整合: 前端知识图谱+B站视频整合,以后会不断升级。...

原创 element-admin的侧边栏导航和权限

element-admin的侧边栏引入方法：我的有道云笔记可以下载：element-admin的侧边栏导航和权限（下载文件资源的附件）侧边栏导航配置项// 当设置 true 的时候该路由不会在侧边栏出现 如401，login等页面，或者如一些编辑页面/edit/1hidden: true // (默认 false)//当设置 noRedirect 的时候该路由在面包屑导航中不可被点击redirect: 'noRedirect'// 当你一个路由下面的 children 声明的路

原创 通过vue-cli3搭建npm包的组件项目，并发布到npm

搭建项目：可以通过vue-cli3快速搭建项目：（https://cli.vuejs.org/zh/guide/installation.html）npm install -g @vue/cli通过vue ui启动图形化界面（图形化搭建项目）vue ui启动之后的界面：创建项目选择默认的配置项目目录结构调整｜--- examples // 项目原src目录，改成examples作为示例展示｜--- packages // 新增packages用于存放组件

原创 手写一个Vue.js响应式框架

准备工作数据驱动 响应式的核心原理 发布订阅和观察者模式 github源码：https://github.com/HZhen/Vue-framework数据驱动数据响应式、双向绑定、数据驱动 数据响应式 数据模型仅仅是普通的JavaScript对象，而当我们修改数据时，视图会进行更新，避免了繁琐的DOM操作，提高开发效率 双向绑定 数据改变，视图改变；视图改变，数据也随之改变 我们可以通过v-model在表单元素上创建双向数据绑定 数据驱动是Vue最独特的特性之一 开

原创 Vue.js 框架源码与进阶

导学课程目标了解什么是虚拟DOM，以及虚拟DOM的作用 Snabbdom的基本使用 Snabbdom的源码解析什么是Virtual DOMVirtual DOM（虚拟DOM），是由普通的JS对象来描述DOM对象，因为不是真实的DOM对象，所以叫Virtual DOM 真实DOM成员可以使用Virtual DOM来描述真实DOM，示例{ sel: "div", data: {}, children: undefined, .

原创 编写可维护的JavaScript--基本的格式化、注释、语句和表达式、变量、函数和运算符

基本的格式化缩进层级使用制表符进行缩进每一个缩进层次都用单独的制表符（tab character）表示。所以一个缩进层级是一个制表符，两个缩进层级为两个制表符。这种方法有两个主要的好处：制表符和缩进层级之间是一对一的关系，这是符合逻辑 文本编辑器可以配置制表符的展现长度使用空格符进行缩进每个缩进层级由多个空格字符组成。在这种观点中有三种具体的做法：2个空格表示一个缩进，4个空格表示一个缩进，以及8个空格表示一个缩进。尽管是选择制表符还是选择空格做缩进只是一个个人偏好，但绝对不用将两者

原创 JavaScript--数据结构与算法(三)

数据结构栈 队列 链表 矩阵 二叉树 堆栈它是一种运算受限的线性表。限定仅在表尾进行插入和删除操作的线性表；先进后出的特点棒球比赛知识点：利用栈的特点，先进后出来实现这个题目的功能代码实现：export default (arr) => { // 用数组来实现堆栈结构 let result = [] // 上一轮的数据 let pr...

原创 JavaScript--数据结构与算法(二)

排序知识点：找规律，实现排序题目和变种排序的题目参考文档：十大经典排序算法动画与解析 十分钟搞定时间复杂度排序需要清楚时间复杂度和空间复杂度时间复杂度是计算运行的次数，空间复杂度是计算占用的内存题目：冒泡排序代码实现：export default (arr) => { // 冒泡排序 let len = arr.length // 通过i来控制...

原创 JavaScript--数据结构与算法(一)

算法：这里的算法都是leetCode上的题目：leetCodegithub代码地址：JavaScript--数据结构与算法理解算法的本质学会挖掘"规律" 通过"解题"夯实基础算法 举一反三学会变通和延伸基础算法：字符串 数组 正则表达式 排序 递归数据结构堆、栈 队列 链表 矩阵 二叉树进阶算法贪心算法 动态规划环境搭建：E...

原创 Javascript实现二叉树算法

目录二叉树算法原理及代码实现二叉树定义中序遍历前序遍历后序遍历二叉树节点查找二叉树叶子节点的删除原理及实现二叉树算法原理及代码实现二叉树定义8：二叉树的根节点4、7、13：二叉树的叶子节点其他：中间节点排序二叉树：特点：节点的左子节点小于当前节点，节点的右子节点大于当前节点代码实现：<!DOCTYPE html&gt...

原创 koa入门

目录简介应用上下文(Context)请求(Request)响应(Response)使用koa搭建一个简单的项目(下面的文档可以参考一下)koa2从搭建项目到实现API 这里梳理一下koa2项目简单的流程：app.js引入路由route router中绑定controllers中的方法 controllers处理发送的请求并调用modules中的sql方法...

原创 ES6快速入门

这篇博客是根据慕课网上的ES6快速入门教程的视频总结的，有兴趣的可以去看下视频（免费）三种语法实现同一个功能，从而加深对三种语法的运用，最后了解ES6的优势知识点：常量、作用域、箭头函数、默认代理、对象代理常量：// ES5 中常量的写法Object.defineProperty(window,"PI2", { value: 3.1415926, wri...

原创 git基础

对应文档：Git的基础 目录Git的基础管理历史记录的数据库修改记录的提交工作树和索引教程1 Git的基础安装Git初期设定新建数据库提交文件共享数据库push到远程数据库克隆远程数据库从远程数据库pull教程2 共享数据库在GitHub建立远程数据库push到远程数据库克隆远程数据库从克隆的数据库进行push从远程...

原创 JavaScript判断浏览器版本

因为业务需求，项目经理让我做一个判断当前浏览器是否是谷歌浏览器，并确定谷歌浏览器版本，不满足谷歌浏览器和版本就显示一个页面提示升级，满足条件就跳转到我们的一个项目，下面先来实现这个：1.当前浏览器是否是谷歌浏览器和确定浏览器浏览器版本号JavaScript实现：/* 检查浏览器是否为谷歌 */(function() { //取得浏览器的userAgent字符串 var my...

原创 Vue核心知识--Vuex

目录Vuex-集成Vuex之state和gettersStateGetterVuex之Mutation和ActionMutationActionVuex之模块ModuleVuex之其他的一些API和配置Vuex-集成1.声明一个store,并在应用入口new Vue中引入这个store，下面是结构：app.js:const sta...

原创 Vue核心知识--Router

目录Vue-router之集成Vue-router之路由参数传递Vue-router之导航守卫全局前置守卫：全局解析守卫全局后置钩子路由独享的守卫组件内的守卫完整的导航解析流程Vue-router之集成index.js：import Vue from 'vue'import Router from 'vue-router'import rou...

原创 回到顶部效果

锚链接优点：简单快速、没有兼容性问题缺点：视觉上不够直观，用户体验不够好用JavaScript制作回到顶部效果当滚动条滚动一定距离的时候，页面就出现回到顶部的图标 点击按钮滚动条滚动到顶部主要知识点DOM操作：document.getElementById 根据ID获取标签元素 document.documentE...

原创 uni-app入门(二)--条件编译和高效开发技巧

条件编译跨端兼容uni-app 已将常用的组件、JS API 封装到框架中，开发者按照 uni-app 规范开发即可保证多平台兼容，大部分业务均可直接满足。但每个平台有自己的一些特性，因此会存在一些无法跨平台的情况。大量写 if else，会造成代码执行性能低下和管理混乱。 编译到不同的工程后二次修改，会让后续升级变的很麻烦。在 C 语言中，通过 #ifdef、#ifndef ...

原创 uni-app入门(一)--介绍

目录框架介绍开发规范目录结构生命周期应用生命周期页面生命周期路由路由跳转页面栈运行环境判断开发环境和生产环境页面样式与布局尺寸单位样式导入内联样式选择器全局样式与局部样式CSS变量固定值Flex布局背景图片字体图标框架介绍开发规范为了实现多端兼容，综合考虑编译速度、运行性能等因素，uni-...

原创 Vue核心知识

VUE实例vue实例的创建和作用 vue实例的属性 vue实例的方法1. vue实例的创建和作用new Vue({ render: (h) => h(App) //vue在创建Vue实例时,通过调用render方法来渲染实例的DOM树,也就是这个组件渲染的是App的内容 //vue在调用render方法时,会传入一个createElemen...

原创 前端知识点

原文文章：前端工程师手册前端知识点HTML + CSS对Web标准的理解、浏览器内核差异、兼容性、hack、CSS基本功：布局、盒子模型、选择器优先级及使用、HTML5、CSS3、移动端一些自适应或垂直水平居中问题汇总 Normal Flow Containing Block Margin Collapse BFC Baseline Writing Mode un...

转载 前端工作过程遇到的问题总结(八)

目录前端实现文件下载功能前端实现图片上传功能element ui 表单验证不通过this.$nextTick(() => {})的作用JavaScript 判断对象中是否有某属性的常用方法JS根据身份证号码算年龄element ui的表格鼠标定义右键菜单vue 操作数组的变异方法和非变异方法vue使用lodashjavascript页面刷新的几种...

转载 前端工作过程遇到的问题总结(七)

目录解决浏览器Chrome net::ERR_BLOCKED_BY_CLIENTJavaScript对象与JSON字符串的相互转换vue 引入iview3.x使用less更换主题的过程报错解决详解vue 兼容IE报错解决方案vue v-for src 图片路径问题 404vue-element-admin兼容IE解决vue单个元素绑定多个事件 例如点击绑定多个事件...

转载 前端的资源、工具函数和文章分享（一）

1.lodash一个 JavaScript 的实用工具库, 表现一致性,模块化, 高性能, 以及可扩展：官方文档2.Util.js-ES6实现的常用100多个javaScript简短函数封装合集： github地址 segmentfault介绍3.去除富文本中的html标签及vue、react、微信小程序中的过滤器：segmentfault文档(文章)4....

转载 快速上手CSS预处理语言Less--模板(常用的CSS3效果函数及常用颜色搭配)

大佬的文档：Less定义常用的CSS3效果函数及常用颜色搭配直接上代码：定义圆角及调用 /*定义圆角@radius 圆角大小*/.round(@radius:5px){ border-radius:@radius; -webkit-border-radius: @radius; -moz-border-radius: @radius;}.round...

转载 前端开发知识点--Git

关于git，是我在网上搜集的我常用的git使用的文章：git 拉取远程分支到本地 Git基本命令和GitFlow工作流 git中如何切换分支，拉取分支，合并分支 git 用不同的邮箱配置不同的ssh（配置config 文件在./ssh下），然后可能拉取也会出错，再参考这篇文章Permission denied (publickey). fatal: Could not read fro...

原创 vue-cli3的配置参考

目录目标浏览器vue.config.jspublicPathoutputDirassetsDirindexPathfilenameHashingpageslineOnSaveruntimeCompilertranspileDependenciesproductionSourceMapcrossoriginintegrityconfi...

原创 Vue Router的API参考

<router-link><router-link>组件支持用户在具有路由功能的应用中(点击)导航。通过 to 属性指定目标地址，默认渲染成带有正确链接的 <a> 标签，可以通过配置 tag 属性生成别的标签。另外，当目标路由成功激活时，链接元素自动设置一个表示激活的CSS类名。<router-link>比起写死的 <a href="....

原创 Vue Router入门--进阶

目录导航守卫全局前置守卫全局解析守卫（2.5.0 新增）全局后置钩子路由独享的守卫组件内的守卫完整的导航解析流程路由元信息过渡动效单个路由的过渡基于路由的动态过渡数据获取导航完成后获取数据在导航完成前获取数据滚动行为异步滚动路由懒加载把组件按组分块导航守卫正如其名，vue-router 提供的导航守卫主要用来通过跳转或...

原创 Vue Router入门--基础

目录介绍基础动态路由匹配嵌套路由编程式的导航命名路由命名视图重定向和别名路由组件传参HTML5 History 模式介绍Vue Router是Vue.js官方的路由管理器。它和Vue.js的核心深度集成，让构建单页面应用变得易如反掌。包含的功能有：嵌套的路由/视图表 模块化的、基于组件的路由配置 路由参数、查询、通配符 基于Vue.j...

原创 在vue项目中引入vuex(全局状态管理器)

目录Vuex是什么？StateGetterMutationActionModule项目结构Vuex是什么？Vuex是一个专为Vue.js应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。简而言之，就是全局状态管理更合适；在state中定义了一个数据，然后在所在项目中的任何一个组件里进行获...