自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

原创 vsCode安装使用教程和插件安装

vsCode安装使用教程vsCode是什么vsCode安装vsCode汉化vsCode常用命令说明vsCode左边图标说明vsCode基本使用常用插件vsCode是什么Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器,支持几乎所有主流的开发语言的语法高亮、智能代码补全、自定义热键、括号匹配、代码片段、代码对比 Diff、GIT ...

2018-11-25 18:00:16 20974 6

原创 Git:命令总结

git命令总结Git是什么1.下载2.安装3.创建本地仓库①配置身份,设置用户名与邮箱②查看配置的用户名和邮箱(和设置时差不多,去掉用户名和邮箱即可)③创建代码仓库④查询本地仓库⑤删除本地仓库⑥提交本地代码(只需要使用add与commit命令即可)⑦将指定的文件或目录排除在版本控制之外4.常用命令①git清空内容②git比对上次②git比对上次③查看历史提交信息④撤销自上次提交后的所有更改⑤撤销已...

2019-04-24 03:11:25 122

原创 VUE:状态管理(Vuex)

状态管理VuexVuex使用流程State①通过计算属性显式store数据②mapState 辅助函数MutationsGetters①概述②以属性形式访问getter③通过方法访问getter【方法】mapGetters 辅助函数Actions①概述②实例③给actions方法传参③在组件中分发 Action④根据action的异步执行结果在组件中做些事情⑤修改state的选择modulesV...

2019-04-23 01:12:15 133

原创 VUE:详解路由(router)

路由routerVUE路由整体的实例路由导航①更换路由地址②tag属性③自动设置类④设置行内样式路由视图路由器配置路由在组件中访问路由器对象动态的路径参数(多种情况匹配同一个组件)①基本使用②细节分析③可设置多段【动态路径参数】④可带查询参数⑤动态路径的参数发生变化时,对应组件会被复用⑥监听【动态的路径参数】的变化⑦路由匹配的优先级嵌套路由【显示多层级的路由视图】①在组件中添加路由②在路由器中添加...

2019-04-22 00:14:22 141

原创 Webpack:配置插件(plugins)

配置插件pluginsplugins使用插件的方法插件使用实例pluginsPlugin 用于扩展 Webpack 功能,各种各样的 Plugin 几乎让 Webpack 可以做任何构建相关的事情在webpack中,loader 用于对模块的源代码进行转换。而插件目的在于解决 loader 无法实现的其他事。插件并不直接操作单个模块,它直接对整个构建过程其作用使用 Plugin 的难点在于...

2019-04-18 18:34:08 265

原创 Webpack:配置模块(module)

配置moduleModuleLoader概念Modulemodule 配置如何处理模块Loader概念loader 用于对模块的源代码进行转换loader 可以使你在 import 或"加载"模块时预处理文件因此,loader 类似于其他构建工具中“任务(task)”,并提供了处理前端构建步骤的强大方法。loader 可以将文件从不同的语言(如 TypeScript)转换为 Jav...

2019-04-18 18:23:41 159

原创 Webpack:配置出口(Output)

配置出口entry

2019-04-17 19:49:24 108

原创 VUE:搭建脚手架——单文件组件

配置入口entry1. vue单文件组件写法①什么是vue单文件组件写法②为什么要使用vue单文件组件写法③单文件写法示例2. 在webpack中使用vue单文件组件①安装nodejs , 搭建nodejs环境②用node自带npm安装yarn③创建项目目录(以英文命名)④在根目录(my-project)下创建package.json文件⑤用yarn全局安装webpack⑥在项目根目录(vuewe...

2019-04-17 18:35:52 158

原创 Webpack:配置入口(entry)

详解WebpackWebpack的核心概念①入口(entry)Webpack的核心概念①入口(entry)入口起点(entry point)指示 webpack 应该使用哪个模块,来作为构建其内部依赖图的开始,webpack 会找出有哪些模块和 library 是入口起点(直接和间接)依赖的...

2019-04-17 00:20:43 228

原创 Webpack:Webpack入门

详解WebpackWebpack是什么Webpack做什么Webpack的安装【全局与本地】①安装命令②检测全局安装是否成功本地安装webpack①创建本地项目目录②创建package.json文件③执行安装命令Webpack的基本使用模块化ES6模块语法示例演示关于警告开发模式 或 生产模式打包为开发模式打包为生产模式把打包命令写入package.json中打包演示--开发模式打包打包演示--生...

2019-04-16 20:23:10 85

原创 VUE:自定义指令

自定义指令简介指令的注册全局注册指令(和全局注册一样)局部注册指令(和局部注册一样)自定义指令中的钩子函数概念具体的钩子函数(指令的生命周期内)使用示例各钩子函数概览钩子函数参数el: 表示指令所绑定的元素,可用来直接操作DOMbinging: 一个绑定对象,主要的属性如下:Vnode: vue编译生成的虚拟节点oldVnode: 上一个虚拟节点,仅在update和componentUpdate钩...

2019-04-14 20:13:11 55

原创 VUE组件:slot(插槽)

组件的高级用法递归组件递归组件类似于js函数可以递归一样,组件也可以递归调用,即自己调用自己要实现组件递归,过程如下:第一步:给组件本身加上一个name属性第二步:为了递归时不会无限的执行下去,你必须加一个结束条件来限制递归数量...

2019-04-14 18:21:04 75

原创 VUE组件:组件通信

组件通信概述组件通信的几种方式(一)父到子的通信(二)子到父的通信①父子组件的概念②子组件向父组件通信流程③扩展一:在组件标签上绑定原生事件④扩展二:自定义事件@input的语法糖——v-model直接用语法糖v-model绑定一个计算属性概述所谓组件间的通信,实际上就是指在各个组件间,进行参数或者信息的相互传递。比如通过props给子组件传参,实际上这就是父组件向子组件进行单向的通信组件...

2019-04-11 00:55:58 124

原创 VUE:自定义组件中v-model以及父子组件的双向绑定

日常我们使用v-model<div id="app"> <p>{{message}}</p> <input type="text" v-model='message'></div><script> var vueApp = new Vue({ el:'#app', ...

2019-04-10 19:30:18 2827

原创 VUE组件:组件的数据传递(props)

组件的数据传递props的作用使用props流程①给组件添加props选项②在调用组件时传入实际参数即可③完整代码及效果④使用props传递分析使用props传递数据时的一些细节①传参时,名称格式的问题②传递动态数据③Vue2参数传递是单向数据流在子组件中如何使用参数props①参数原封不动的使用②参数作为某种状态的初始值使用③参数作为需要被转换的原始值使用对传入参数props进行数据验证①使用对...

2019-04-09 19:57:37 2738 1

原创 VUE组件:全局组件和局部组件的注册

VUE组件深入理解组件简介组件的基本使用全局注册①注册全局组件②全局组件使用进阶③组件内容中的其他选项局部注册注册局部组件组件简介组件系统是Vue.js其中一个重要的概念,它提供了一种抽象,让我们可以使用独立可复用的小组件来构建大型应用,任意类型的应用界面都可以抽象为一个组件树:组件的基本使用和创建一个vue实例需要创建后才能使用类似,组件也需要进行注册(定义)后才能使用。注册分为全局注...

2019-04-08 20:54:48 1489

原创 VUE实践:Vue实现todoList(任务计划列表)

todoList(任务计划列表)首先,如果你能实现任务计划表的话说明你能用该框架进行开发了,所以这也是一个简单的评判标准之后呢,还没有明白的可以看一下我的代码,基本上每条我都注释了,如果有不明白的地方可以直接留言,我会及时回答的先上效果图:源码来了:<!DOCTYPE html><html lang="en"><head> <me...

2019-04-08 04:23:50 582

原创 VUE:插值与绑定

Vue框架数据模型层M与视图层V双向绑定,自动刷新{{ }} :插入与绑定文本(类似与innerText的作用)①{{ 变量名 }}插入与绑定文本实例代码<body> <!-- 相当于视图V层 --> <div id="app"> <h1>{{message}}</h1> &...

2019-04-07 22:18:20 152

原创 VUE:双向绑定的原理和实现(浅谈)

vue数据双向绑定原理VUE实现双向数据绑定的原理就是利用了 Object.defineProperty() 这个方法重新定义了对象获取属性值(get)和设置属性值(set)的操作来实现的之后我们先来看这个参数,参数的详细用法在这里 点击这里阅读详细用法这里我们大概说一参数的用法参数Object.defineProperty() 接收三个参数要操作的对象要定义或修改的对象属性名属...

2019-04-07 04:07:37 104

原创 JS拓展:异步与worker

代码是种艺术,甚于蒙娜丽莎的微笑同步与异步的概念同步:必须等上面的任务或代码执行完成后才能执行异步:无须等待上面的任务或代码执行完就可以执行,可以和上面的任务并行执行单线程与多线程概念单线程:同一时刻只能做一件事【同步】多线程:同一时刻可以做多件事【异步】JS借助浏览器多线程实现异步JavaScript就其本身而言是单线程的,即只会有一个线程从上往下运行JavaScript...

2019-04-03 21:32:43 245

原创 进程和线程的区别

进程和线程一句概括的总论:进程和线程都是一个时间段的描述,是CPU工作时间段的描述听完一脸蒙蔽是吧,没关系,接着往下看最基础的事实:当多个任务需要执行的时候,在CPU看来就是轮流着来必须知道的事实:执行一段程序代码,实现一个功能的过程介绍 ,当得到CPU的时候,相关的资源必须也已经就位,就是显卡啊,GPS啊什么的必须就位,然后CPU开始执行。这里除了CPU以外所有的就构成了这个程序的执行环...

2019-04-03 17:43:11 50

原创 调用百度地图获取路线,修改覆盖物样式

先上效果图之后上源码,由于是第一次用地图的api,写的可能有点乱,大家理解下(function ($) { $(function () { var map = new BMap.Map("l-map"); // 创建Map实例 map.centerAndZoom(new BMap.Point(104.072267, 30.663...

2019-04-03 12:35:59 516

原创 VUE实践:用vue实现简单的购物车

先上效果图购物车的页面,有点丑,大家将就看勾选商品和修改商品的数量会显示相应的价格全选和取消全选删除商品对商品的排序对商品价格的过滤好了,该上源码了<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="v...

2019-04-03 11:39:58 174

原创 JS基础:面对对象(三)原型链

首先,我们需要明白原型链主要是实现继承的功能其次,我们要弄清楚对象普通对象最普通的对象:有__proto__属性(指向其原型链),没有prototype属性原型对象(原型对象有__proto__和constructor属性(指向构造函数对象))函数对象凡是通过new Function()创建的都是函数对象最后,我们还要记住一句话:JS中不管是什么类型的对象,都一定有构造函数,包括...

2019-04-02 18:48:27 110

原创 前端插件:雪碧图(多图压缩为一张)

CSS SpritesCSS Sprites又称CSS精灵 (谐音为css雪碧),是一种网页图片应用处理方式CSS Sprites目的将一个页面内所需要显示的图片全部整合到一张大图中,并使用css属性background-position进行调用这样的话,当页面渲染时,可以减少请求次数,在一定程度上能够加快网页加载速度通过gulp生成使用雪碧图(css精灵)①先自动生成package....

2019-04-01 18:40:52 2483 4

原创 JS基础:面对对象(二)原型模式

在面对对象(一)中说了关于对象以及原型对象,当然内容有些长,需要有耐心看下去,今天来谈下原型对象中的一些属性和方法首先,先来两个关于构造函数实例的内部属性[[Prototype]]的方法[[Prototype]]是构造函数实例的内部属性,在所有的实现中是没有办法访问的,作用是指向构造函数的原型对象,理解这个属性,你就会发现,实例与构造函数没有直接的关系,而是与构造函数的原型对象有直接的关系...

2019-03-23 18:52:41 37

原创 用npm创建自己的模块并进行发布

创建npm账号npm adduser按照提示输入账号,密码和邮箱,然后将提示创建成功【注意】npm adduser成功会自动登陆,所以不需要再登录了登录npm账号如果你本来就有npm账号,那么这时你就可以进行npm登录,命令如下:npm login此时你同样按照提示输入账号,密码,邮箱,进行登录即可构建自己要发布的包准备独一无二的包名先准备一个包的名字,名字只能由小写英...

2019-03-07 19:53:36 577

原创 JS拓展:Babel(解决低版本浏览器对es语法的兼容)

JavaScript版本ECMAScriptECMAScript 是跨多个平台的许多厂商实施的不断发展的标准,JavaScript是其实现(同时也好有其他实现,不过JavaScript是主流)ES5发布在2009年,在Java的神奇崛起之前。JavaScript第五版(es5)正式发布ES6发布时隔六年,2015年JavaScript第六版(es6)发布,此后,由于前端占据...

2019-03-06 21:03:43 1971

原创 npm基本命令

首先,什么是npm?Npm(Node Package Manager) 是node的包管理工具,是用JavaScript写出来的工具 ,被内置进了node中什么叫包:每个模块,每个函数都可以是一个包npm大概思路买个服务器作为代码仓库(registry),在里面放所有需要被共享的代码发邮件通知 jQuery、Bootstrap、Underscore 作者使用 npm publish 把代...

2019-03-06 20:19:31 2768

原创 JS基础:面对对象(一)创建对象,工厂模式,原型模式,原型对象,构造函数

创建对象的方法使用Object构造函数:var person = new Object(); person.name = "Nicholas"; person.age = 29; person.job = "Software Engineer"; person.sayName = function(){ alert(this.name); };字面量创建对象:var per...

2019-03-05 21:14:38 80

原创 前端插件:数据可视化-Echarts使用指南

Echarts是什么ECharts,一个使用 JavaScript 实现的开源可视化库,它可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),其底层依赖轻量级的矢量图形库 ZRender,提供直观,交互丰富,可高度个性化定制的数据可视化图表Echarts的特点与好处1.丰富的可视化类型2.多种数据格式...

2019-03-05 17:49:22 966

原创 TCP协议简介和三次握手

首先我们要明白什么是TCPTCP 是互联网核心协议之一,下面我们来说下它的作用互联网由一整套协议构成以太网协议(Ethernet)最底层的以太网协议(Ethernet)规定了电子信号如何组成数据包(packet),解决了子网内部的点对点通信以太网协议解决了局域网的点对点通信,但是,以太网协议不能解决多个局域网如何互通,这由 IP 协议解决图片说明:以太网协议解决了局域网的点对点通...

2019-03-03 20:53:50 89

原创 JS基础:this关键字详解

首先,我们需要搞清楚在JS里面,函数的几种调用方式:普通函数调用作为方法来调用作为构造函数来调用使用apply/call方法来调用Function.prototype.bind方法es6箭头函数但是不管函数是按哪种方法来调用的,请记住一点:谁调用这个函数或方法,this关键字就指向谁接下来就分情况来讨论下这些不同的情况:...

2019-03-01 21:01:36 41

原创 JS拓展:解构赋值,默认参数(Default) + 不定参数(Rest) + 扩展运算符(Spread),箭头函数

解构赋值在ES5我们提取对象中的信息形式如下://定义对象 const people = { name: 'lux', age: 20}//取出对象的属性 const name = people.name const age = people.age console.log(name + ' --- ' + age)在es...

2019-02-27 20:58:42 329

原创 JS拓展:Let和变量提升(函数预编译)

①Let(定义变量)在es5中我们声明变量一般是使用var,然而var具有变量提升的功能,有可能会给我们带来出乎意料的异常变量提升是什么用var声明一个变量,他会被提升到函数或全局作用域的顶部。这样在变量声明之前就可以获取到此变量如果变量声明时给了初始值,那么值不会被提升,提升到最顶部的变量是一个未初始化值的变量变量提升带来的问题var ar=[];for (var i = 0...

2019-02-27 19:49:13 422

原创 Node.JS项目:简单的用户管理系统(带有Token验证,Mysql数据库并且实现7天免登录)

首先,我们需要创建一个项目,在里面创建一个package.json文件,里面包含了包的属性,之后我们可以通过命令来一次性安装package.json中所包含的包①创建package.json文件{ "dependencies": { "body-parser": "^1.18.3", "cookie-parser": "^1

2019-02-27 18:57:50 852

原创 JS基础:基本包装类型

首先,要了解这个概念,我们要明白什么基本包装类型和引用类型基本类型和引用类型的值ECMAScript 变量可能包含两种不同数据类型的值:基本类型值和引用类型值基本类型值指的是简单的数据段引用类型值指那些可能由多个值构成的对象5 种基本数据类型:Undefined、Null、Boolean、Number 和 String引用类型的值是保存在内存中的对象。与其他语言不同,JavaScrip...

2019-02-26 13:15:44 494

原创 JS总结:跨源资源共享

这里先来解释一下什么是源源(origin)就是协议、域名和端口号这个url就是一个源:http://www.company.com:80若地址里面的协议、域名和端口号均相同则属于同源以下是相对于 http://www.a.com/test/index.html 的同源检测• http://www.a.com/dir/page.html ----成功• http://www.child....

2019-02-22 00:07:35 215

转载 JS基础:回调函数

回调函数回调函数就是一个通过函数指针调用的函数。如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用来调用其所指向的函数时,我们就说这是回调函数。回调函数不是由该函数的实现方直接调用,而是在特定的事件或条件发生时由另外的一方调用的,用于对该事件或条件进行响应通俗的理解:回调函数就是一个参数,将这个函数作为参数传到另一个函数里面,当那个函数执行完之后,再执行传进去的这个函数。这个过...

2019-02-21 23:43:03 46

原创 JS基础:Function 类型

Function 类型每个函数都是 Function 类型的实例,而且都与其他引用类型一样具有属性和方法。由于函数是对象,因此函数名实际上也是一个指向函数对象的指针,不会与某个函数绑定。函数通常是使用函数声明语法定义的,如下面的例子所示function sum (num1, num2) { return num1 + num2; }这与下面使用函数表达式定义函数的方式几乎相差无几v...

2019-02-18 13:16:22 87

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