- 博客(27)
- 收藏
- 关注
原创 ts入门学习笔记
ts入门学习笔记基础1. 原始数据类型分为:boolean、number、string、void、undefined、null// 布尔值let isDone: boolean = false;// 数值let decLiteral: number = 6;// 字符串let myName: string = 'Tom';// 空值function alertName(): void { alert('My name is Tom');}// Null 和
2021-01-28 16:18:57
1187
原创 如何自定义网络拓扑图(d3)
代码已实现,封装中。。。功能如下:展示节点信息,包含节点名称、子节点数量、节点状态、告警数量。 节点之间的关联可以选择是否展示箭头,箭头样式可以自定义。 节点点击事件。点击节点名称,可以查看节点详情;点击节点展开图标,可以展开或者隐藏下游节点;悬浮出现“+”图标,点击可以展示关联内容。 鼠标悬停对象图标上方,本图标和所关联对象之间的线条高亮,并显示两者关系。 鼠标按住对象图标,可对...
2019-10-17 16:19:51
1479
6
原创 使用 es3、es5、es6 实现简单工厂模式、单例模式、观察者模式、发布订阅模式
前言最近公司晋升岗位里面的一道小题《使用 es3 实现简单工厂模式、单例模式、观察者模式、发布订阅模式》,结束之后发现自己还要补好多´д` ;,抽空把里面几道小题,重新复习了一遍,扩充到es3、es5、es6,并做了笔记(再次膜拜公司出题大佬)。完整版github代码地址:https://github.com/xuhuihui/smallDemo/blob/master/demo/demo...
2019-09-30 17:36:19
652
原创 js高级基础面试准备内容
1. 绑定多个 onclick 事件, 输出什么?onclick 属于 dom 的 Level 0 标准普通情况下:输出最后一个 onclick 事件 。// 只弹出 hehebt.onclick = () => { alert('haha')}bt.onclick = () => { alert('hehe')}2. 如何在一个 dom 上绑定多个 ...
2019-07-17 11:25:14
167
原创 HTML语义化
html标签的分类 语义类标签的好处: 增强可读性,页面结构清晰,便于团队的开发和维护 有益于搜索引擎检索(SEO),支持读屏软件,根据文章自动生成目录等。 对于语义标签,用对比不用好,不用比用错好。 语义标签的4种使用场景: 自然语言能力的补充(注解) HTML有些标签是必须的,如果没有,文字会产生歧义。例如某种场景下表示强调的em 文章标...
2019-07-17 11:06:26
182
原创 web 安全问题及解决方案
1. SQL注入直接在SQL里执行了用户输入。解决方案:输入验证,检查用户输入的合法性。 错误消息处理,防范SQL注入,还要避免出现一些详细的错误消息。 加密处理。2. XSS漏洞(跨站脚本攻击)定义:在HTML里代码执行了用户输入。例子:恶意攻击者往Web页面里注入恶意Script代码,用户浏览这些网页时,就会执行其中的恶意代码,可对用户进行盗取cookie信息、会话劫持等各...
2019-03-27 13:21:31
382
原创 react数据管理
方法 依靠状态提升来和兄弟元素进行数据交互 应用场景:组件层级扁平,兄弟组件通信情况很少 通过发布订阅模式做数据交互:通过观察者模式 应用场景:业务规模较小,层级较深的业务 redux等数据管理工具:redux单向数据流 应用场景:业务复杂,组件层级较深,兄弟组件通信密切 ...
2019-03-27 13:17:30
343
原创 react的生命周期
生命周期简介class App extends React.Component { //构造函数 constructor(props) { super(props) this.state = { data: 'old' } console.log('constructor') } //组件将要加载 componentWi...
2019-03-27 13:09:23
171
原创 如何优化动画???
动画基础知识1. 动画帧率(FPS)计算帧的定义:1幅画就叫做“1帧”,每秒帧数指的就是“每秒播放的画面数”。每一帧都是静止的图象,快速连续地显示帧便形成了运动的假象。高的帧率可以得到更流畅、更逼真的动画。每秒钟帧数 (fps) 愈多,所显示的动作就会愈流畅。理论上说,FPS 越高,动画会越流畅,目前大多数设备的屏幕刷新率为 60 次/秒,所以通常来讲 FPS 为 60 frame/s...
2019-03-12 14:36:17
1411
原创 js基础面试准备内容
js基础知识题目 JS中使用typeof能得到的哪些类型?(考点:变量类型) object,string,number,boolean,function,undefined 何时使用"===",何时使用"==",为什么要使用"==="?(考点:强制类型转换) (1) Object.is的用法跟"==="的用法一样 if (obj.a == null) { // 判断对...
2018-11-01 19:45:57
2231
原创 svg、canvas、css3d实现数据可视化(伪3d)
前言:这次项目用到了一些自定义的数据可视化组件,我把我做的部分抽出来几个典型做个汇总。分为如下:星球环绕旋转图 -- 方法一: svg:animateMotion+ animateTransform 方法二:css3d 地图 -- svg渲染 + div悬浮框 + js事件 二维饼图(风车图) -- canvas: dragCircle 、 stopDragging 三棱锥 -...
2018-08-07 14:32:00
7671
原创 canvas简单封装一个echarts实现不了的饼图
效果展示:我用echars很久了,如果出现如上图所示样式的饼图,我用echarts很难实现,官方给的文档没有这种模式的饼图。试过用d3和canvas分别画饼图,因为本人对canvas比较熟悉和d3还要引入插件,本着轻量化的原则,所以采用canvas封装。官方饼图两种模式:(1)半径模式(2)面积模式实现过程封装的函数如下: function drawCircle(canvasId, optio...
2018-06-11 16:14:13
977
原创 vue中将网页以pdf格式下载
1、下载 html2canvas和jspdf 两个插件yarn add html2canvas jspdf2、html2canvas 和 jspdf github地址https://github.com/niklasvh/html2canvashttps://github.com/MrRio/jsPDFhtml2canvas官方示例:http://html2canvas.hertzen.co...
2018-06-05 15:07:36
1772
1
原创 使用svg(1)-画一张星空背景图
github网址:https://github.com/xuhuihui/svg<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, i
2018-06-05 15:00:04
1602
原创 parcel学习过程(一)--项目启动
中文手册:http://www.itbaby.me/doc/parcel/学习代码:https://github.com/xuhuihui/parcel1.首先使用 Yarn 或 npm 安装 Parcel :Yarn:yarn global add parcel-bundlernpm:npm install -g parcel-bundler2.使用以下命令在你的项目目录中创建一个 packag...
2018-06-05 14:58:00
1171
原创 使用VuePress搭建一个类型element ui文档
网站成果样式项目书写步骤 github地址:https://github.com/xuhuihui/dataCom官网:http://caibaojian.com/vuepress/guide/getting-started.html参考文章:https://www.javascriptcn.com/read-31206.html前言:我先git clone官方gith...
2018-06-04 15:19:10
18123
4
原创 git 多账号 ssh-key 管理(github和gitlab共同使用)
日常使用 git 作为仓库使用时,会遇到以下情况:有两个 github 账号(至少两个),一台电脑同时连接这两个账号进行维护私人 github 账号,公司 gitlab 账号1 清除 git 的全局设置(针对已安装 git)新安装 git 跳过。若之前对 git 设置过全局的 user.name 和 user.email。类似(用git config --global --list 进行查看你是否...
2018-05-07 17:51:20
3473
3
原创 使用dagre-d3做一个dag图(关系图)
dagre-d3插件github地址:https://github.com/dagrejs/dagre-d3csdn引入:<script src="https://d3js.org/d3.v4.min.js" charset="utf-8"></script><script src="../dist/dagre-d3.js"></script&
2018-04-10 11:33:56
40039
30
原创 mockjs新手教程
安装:cnpm install mockjs例子:1.新建文件mock.js,里面的代码如图所示。require引入mockjs,produceNewsData就是一个简单的参数,真正执行的核心函数就一句话Mock.mock('/news/api','post',produceNewsData)2.在app.js里面引用3.role里面调用接口4.console显示结果,接口已经通了。本人总结(个...
2018-03-06 17:05:05
3330
3
原创 常用函数
输出0~n之间的随机整数parseInt(Math.random() * n)过滤中英文()里面的内容,包含括号()function toScene(param) { if (param === null) { return '--' } let scene = param.replace(/\(.*?\)/g, '') scene = scene.replace(/\(...
2018-03-06 16:58:03
111
原创 vue中的父子组件调用
1.把子组件的数据传给父组件App.vue 父组件 Hello.vue 子组件 $emitimport hello from './components/Hello'export default { name: 'app', 'components': { hello }, methods: {
2017-08-14 11:45:03
192
原创 在线小说阅读器app
github地址: https://github.com/xuhuihui/storyRead.git悦书-系统说明文档APP名称:悦书--------一个在线小说浏览器工作量(代码行数/源代码文件数量):代码行数:java类有1264行代码,rawable文件下的xml有747行代码,drawable文件下的xml有385行代码,共计2396行代码。 源代
2017-07-27 16:20:56
1117
转载 git操作和npm操作
把项目clone到本地是没有依赖的,需要执行1. yarn install (安装所有依赖)2. npm run dll (生成dll文件,dll文件是把常用的依赖打包,防止webpack重复编译的,主要是为了提升本地server的效率)3. npm run dev (启动本地node server,浏览器通过localhost:2046访问)4. npm run build (日
2017-07-27 11:44:26
2076
转载 vue的扩展
UI组件element ★9305 - 饿了么出品的Vue2的web UI工具套件Vux ★6802 - 基于Vue和WeUI的组件库mint-ui ★4776 - Vue 2的移动UI元素iview ★4458 - 基于 Vuejs 的开源 UI 组件库Keen-UI ★2363 - 轻量级的基本UI组件合集vue-material ★2207 - 通过Vue M
2017-07-17 16:08:02
791
转载 jsp 快捷键(eclipse)
在当前位置,加注释 CTRL+SHIFT+C关于ECLIPSE的快捷键,详细菜单说明 CTRL+SHIFT+L注释选中内容 CTRL+SHIFT+/
2017-03-16 10:34:42
5263
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人