自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(16)
  • 收藏
  • 关注

原创 react源码之render函数 一

import React, { Component } from "react";import ReactDOM from "react-dom";let jsx = ( <div className="box border"> <p className="p-bb border">这是一个jsx</p> </div>);ReactDOM.render(jsx, document.getElementById("root"));.

2021-07-15 00:22:06 406

原创 react快速入门

create-react-app零配置快速构建项目官方文档地址:https://www.html.cn/create-react-app/docs/getting-started/创建项⽬: npx create-react-app my-app打开项⽬: cd my-app启动项⽬: npm run start暴露配置项: npm run ejectJSX基本语法// 修改index.jsimport React from 'react';import Re.

2021-07-09 00:20:05 123

原创 vue心得之 源码解析v-for为什么要加key

为了标识该节点是该节点,优化patch算法,在某些情况下可以减少dom操作具体使用场景即作用参考下源码(vue2)由以上代码可以理解网上的这两张图了对arrData= [a, b, c, d, e]更新成arrData= [a, b, f, c, d, e]在 v-for循环遍历后添加了key能标识原本的a, b, c, d, e,这样在更新数组后,vue做pa...

2020-04-09 10:36:34 317

原创 ES6异步解决方案promise原理及简单实现

promise原理及简单实现概述解析概述Promise是ES6规范中定义的一种异步解决方案,它可以在异步函数处理流程中分离执行代码和处理结果,还能够添加处理成功、失败后的钩子函数,下面是一个简单案例new promise(funcion(resolve, reject){ window.setTimeout(()=>{ console.log("end 2000"); res...

2019-09-04 10:48:48 536

原创 ElementUI框架源码学习2 公共模块公用

通过资料及文档查找,对js库文件的打包做了如下配置output配置中filename:表示输出文件名称libraryTarget:表示输出方式,此处我选择的是全局变量输出,一般建议配置为umd,既可以支持amd export 也可以支持全局变量library:表示输出的全局变量名称在打包模块中,因为部分js文件引用vue,vuex等模块,所以我重新添加了模块依赖...

2019-08-06 08:44:19 181

原创 ElementUI框架源码学习1 框架结构

1、整体结构2、pack3、webpack 输出配置至此,发现一个东西,libraryTarget,打包类库的相关配置看来是自己对webpack的配置了解太浅薄,准备系统学习一遍webpack相关东西再回来学习ele...

2019-08-01 09:23:28 183

原创 ElementUI框架源码学习

最近项目需求,需要从现有平台代码抽离核心部分进行封装,经过思考决定使用NPM包方式进行输出就此暴露个人在框架搭建部分的短板,决定通过学习ElementUI代码构建方式完成个人模块创建...

2019-07-31 16:07:10 319

原创 typeScript学习笔记 二

1、interface接口抽象interface主要用于抽象一个对象模型,约束对象的属性、类型、结构如上图中person接口内部定义了三个属性,并且标明了不同属性的key类型,此时Tom变量由于声明为person类型,则该变量只能有三个属性,不可多也不可少,且id属性为只读类型,只能在声明时赋值如需对接口进行其他shape定义,可参考如下:1)只读属性readyonly na...

2019-04-15 08:59:51 166

原创 typeScript学习笔记 一

1、指定变量类型注:new Boolean()构造函数创建的是一个对象而不是布尔类型2、void标识没有任何返回值的函数3、任意值类型let msg: any = "hello";注:变量已经声明未赋值也未指定变量类型时,默认为任意类型,如已赋值未只当变量类型则默认为初始值的类型4、联合类型为变量指定多种可能类型let msg:string|numbe...

2019-04-08 16:28:09 102

原创 前端学习心得-javascript设计模式与开发实践-享元模式

享元模式,英文命为flyweight,主要通过共享技术去支持大大量细粒度的对象,从而优化性能假设某一服装店新装上市,有男款、女款各50件,现在需要模特进行试穿拍照。对此,我们有两种处理思路:1、找男女模特各一百个,挨个试穿、拍照2、找男女模特各一个,挨件试穿、拍照显然,在对模特没有特殊要求的情况下,同一类型衣服使用同一个模特(对象)不仅节省资源,也减少意外成本,这就是享元模式的一个...

2019-04-01 10:58:53 126

原创 js回调地狱及解决方案:promise,async

在Javascript中函数是第一类对象,可被存储在变量中,也能作为函数的参数传递js是单线程语言,所有脚本同步执行,但是我们有时候需要等待某个时机才执行某些脚本也就是做异步操作,于是出现了如下代码:我们成setTimeout函数中的参数为回调函数当我们需要在2000ms后,再开启一个定时器,则会如下定义代码:如果需要再timer end2输出后开启更多的定时器,则需要依次...

2019-03-27 14:40:57 1151 1

原创 js——剑指offer 题目1

在一个二维数组中(每个一维数组的长度相同),每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序。请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整数。...

2019-03-21 14:57:35 140

原创 前端学习心得-javascript设计模式与开发实践-AOP面向切面编程

AOP面向切面编程主要用于抽离与核心业务逻辑无关的功能,如日志统计、异常处理等等,可以提高业务模块功能的纯净度与被分离模块的复用性如上例,func函数通过原型链继承Function的方法,可以在自身函数调用前、后分别执行before与after最终输出结果如下:

2017-11-29 15:34:28 740 2

原创 前端学习心得-javascript设计模式与开发实践-高阶函数

高阶函数(满足至少一点):1、函数可以作为参数被传递常用于做回调函数,用于分离业务逻辑中容易变化的部分2、函数可以作为返回值输出让函数在执行完后继续返回一个可执行函数类型判断普通方法,创建一个对象,把每种对象的判断方法作为属性依次写入isType = { isString: function(obj){ return Object.prot

2017-11-29 11:37:01 228

原创 前端学习心得-javascript设计模式与开发实践-命令封装模式

命令封装模式主要用于分离请求的发起者与接受者1、把请求封装为对象2、Switch函数3、设定指令4、调用5、执行结果6、踩坑1)addEventListener和onclick因为书中案例只设置TV实体的指令,并且用的是onclick绑定方式。个人又加了一个air_conditioner,但是控制台只输出了air_cond

2017-11-29 10:50:09 216

原创 前端学习

开始接触前端一年多,工作将近半年。最近在看曽探的《javascript设计模式与开发实践》,受益颇多,开通博客记录自己的学习心得,共勉

2017-11-29 09:02:47 547

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除