随笔分类 - 前端技术栈
摘要：Vue watch 主要用于监听属性的变化，去做一些类似发送请求这样的工作 可以拿到变化前后的属性值 可以检测对象深层次属性以及是否在初始化就触发 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="v
阅读全文
摘要：Vue事件 事件处理 事件修饰符 键盘事件 事件处理 事件绑定: v-on:click 事件不传参：v-on:click="fn" 事件传参：v-on:click="fn(arg,$event)" v-on也可以写成@click <div id="root"> <h1 v-on:click="sho
阅读全文
摘要：Vue 计算属性 定义:根据data中的已有属性计算得到一个新的属性 原理:根据defineProperty方法提供的getter和setter 优点: 对比methods, 优点在于有缓存，可以复用。 特点： 计算属性中的get函数调用时机： 初次读取改属性 该属性的依赖属性变化时 vm中有dat
阅读全文
摘要：MVVM M: model 模型 对应data数据 V: 视图 模板 其实就是html页面 VM: 视图模型 对应vue实例对象 vm通过dom listener和data-binding 为页面和数据建立连接 V ←--> VM ←--> M 数据代理 通过一个对象代理另一个对象中属性的操作, 其
阅读全文
摘要：数据绑定 v-bind是单向数据绑定， 即数据流向页面，反过来页面不会流向数据 v-model是双向数据绑定 不是所有的标签都支持v-model，只能用于表单类元素/输入类元素，即有value的元素 <!DOCTYPE html> <html lang="en"> <head> <meta char
阅读全文
摘要：模板语法 插值语法 指令语法 插值语法一般用于标签体中 指令语法一般用于标签属性，用于解析标签属性 v-bind是单向数据绑定， 即数据影响页面，反过来页面不会影响数据 <script src="../lib/vue.js"></script> <body> <div id="root"> <h1>
阅读全文
摘要：Vue入门 配置对象 vue配置对象，就是new Vue(params)的params el: 指定容器，一般写选择器字符串，或者给一个dom元素，如果选到多个容器，也只用第一个容器，el和root是一对一的关系 data: 数据，提供给el指定的容器去使用, 也只能给容器使用，并且需要配合模板语法
阅读全文
摘要：Vue简介 什么是vue? 一套用于构建用户界面的渐进式JavaScript 如何理解渐进式？ 渐，就是逐渐 进，就是递进 渐进式就是表示Vue可以自底层向上逐层应用 如果是小型应用，只需要引入vue核心库即可，打包完只有100kb 如果是大型应用，可以继续引入其他的vue插件库 特点 采用组件化模
阅读全文
摘要：关于Nodejs 版本:Nodejs单数是非稳定版本，双数是稳定版本 Nodejs是什么 先谈谈Nodejs不是什么 不是Web框架，Nodejs并不是web后端框架，所以不能和Spring或flask对比 不是编程语言，所以不能和Python和php对比 Nodejs是一个平台 将多种技术组合起来
阅读全文
摘要：实现bind 需要注意的是要考虑作为构造函数的case 构造函数会指定this为new出来的实例对象，此时bind指定的目标无效 /** * fn.bind(context) * Function.bind(this: Function, thisArg: any, ...argArray: any
阅读全文
摘要：手写apply /** * Function.apply(this: Function, thisArg: any, argArray?: any): any * @param {*} context */ Function.prototype._apply = function(context){
阅读全文
摘要：手写call /** * 实现call * @param {*} context * fn.call(target,...args) * 让fn中的this指向target * 思路是函数默认指向调用者，在目标对象上挂载fn，执行的时候fn中的this默认指向目标对象， 执行完拿到结果并删除这个挂载
阅读全文
摘要：实现reduce /** * * @param {*} cb callbackfn: (previousValue: any, currentValue: any, currentIndex: number, array: any[]) => any): any * @param {*} thisA
阅读全文
摘要：实现filter /** * 实现filter * @param {*} cb cb : (predicate: (value: any, index: number, array: any[]) => value is S, thisArg?: any): S[] * @param {*} thi
阅读全文
摘要：手写foreach /** * forEach(cb,thisArg) * cb : (value: any, index: number, array: any[]) => void, thisArg?: any): void * 接受第二个参数thisArg，只是定制forEach中this的指
阅读全文
摘要：any绕过类型检查，或者说放弃类型检查 unknown表示未知类型，一般配合断言使用才能通过类型检查 能用unknown尽量用unknown，少用any
阅读全文
摘要：并不是所有的CSS属性都能触发GPU的硬件加速，实际上只有少数属性可以，比如下面的这些： transform opacity filter 对于transform，2D transform 动画在开始和结束时发生的 repaint 操作，因此建议采用以下方式 .example1 { transfor
阅读全文
摘要：正则匹配指定规则字符串的中间内容 假设前缀为prefix，后缀为suffix /prefix(.*)suffix/
阅读全文
摘要：源码目录：react/packages/react-dom/src/client/ReactDOMComponentTree.js const randomKey = Math.random() .toString(36) .slice(2); const internalInstanceKey =
阅读全文
摘要：js开发中可用的位运算 按位与判断数值是否相等 &：按位与，位数都为1才返回1 可用来对2的次幂数做比较 1、2、4、8、16、32、64 0b0001 0b0010 0b0100 0b1000 0b10000 0b100000 0b1000000 左右移 >> 带符号右移 >>> 无符号右移 2
阅读全文
浙公网安备 33010602011771号