- 博客(69)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 前端导出excel表格
1. vue-json-excel安装依赖npm install vue-json-excel在main.js文件全局引入import JsonExcel from "vue-json-excel";Vue.component("downloadExcel", JsonExcel);页面中使用<template> <div class="hello"> <h2>vue-json-excel插件文件下载</h2>
2022-05-30 11:39:37
295
原创 TypeScript学习（4：基础知识）
类的简介：//使用class关键字来定义一个类/** * 对象中主要包含两个部分：属性 + 方法 * */class Person{ /** * 直接定义的属性是实例属性，需要通过对象的实例去访问 * const per=new Person; * per.name * 使用static开头的属性是静态属性（类属性）,可以直接通过类访问 * Person.age * * readonly开头.
2021-03-31 10:06:16
114
原创 TypeScript学习（3：项目中的使用以及配置）
环境搭建：初始化项目：npm init -y安装你所需的依赖：如：npm i -D webpack webpack-cli typescript ts-loadercnpm i -D @babel/core @babel/core @babel/preset-env babel-loader core-jscnpm i -D html-webpack-plugincnpm i -D webpack-dev-servercnpm i -D clean-webpack-plugin然
2021-03-31 10:00:41
215
原创 TypeScript学习（2:tsconfig.json配置）
tsconfig.json是ts编译器的配置文件，ts编译器可以根据它的信息来对代码进行编译 二话不说，直接上代码：详细配置如下{ /* tsconfig.json是ts编译器的配置文件，ts编译器可以根据它的信息来对代码进行编译 "include"用来指定哪些ts文件需要被编译 路径：/**表示任意目录 *表示任意文件 "exclude" 不需要被编译的文件目录 默认值[node_modules,bower_
2021-03-31 09:46:57
205
原创 TypeScript学习（1）
TypeScript的安装与第一个.ts的创建全局安装typescript：npm install -g typescriptcnpm install -g typescriptyarm install -g typescript安装完成后输入tsc-v 检查是否安装完成，安装完成入下图安装成功后在vscode中创建一个文件夹part1，下面创建我们第一个helloTs.ts第一个ts文件在终端使用tsc 01_helloTS.ts 编译，编译成功如下图TypeScript的
2021-03-31 09:36:52
90
原创 webpack学习（1）
目录webpack是什么？webpack五个核心概念webpack打包样式资源webpack打包html资源webpack打包图片资源webpack是什么？webpack是一种前端资源构建工具，一个静态模块打包器(module bundler)。在 Webpack看来,前端的所有资源文件ljs/json/css/img/less/....都会作为模块处理。它将根据模块的依赖关系进行静态分析，打包生成对应的静态资源(bundle)。通俗来说：webpack可以看做是模块..
2021-01-13 16:10:54
160
原创 vuex的学习
vuexVuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。vuex安装：1. npm install vuex --save2. 在main.js中引入import vuex from 'vuex'Vue.use(vuex);var store = new vuex.Store({//store对象 state:{ show:false }})文件
2020-10-26 17:46:02
114
原创 vue中子父组件传值
Vue子组件传值给父组件子组件<template> <div class="app"> <input @click="sendInfo" type="button" value="给父组件传递值"> </div></template><script>export default { data () { return { msg: "我是子组件的
2020-10-20 19:10:39
161
原创 Echarts的简单学习（后续持续补充）
Echarts是什么？ECharts 是一个使用 JavaScript 实现的开源可视化库，涵盖各行业图表，满足各种需求。ECharts 遵循 Apache-2.0 开源协议，免费商用。ECharts 兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等）及兼容多种设备，可随时随地任性展示。Echarts的使用方法：第一步：创建 HTML 页面<!DOCTYPE html><html><head> <
2020-08-07 10:37:43
354
原创 前端面试题（准备）
原型和原型链原型js中的对象都包含了一个prototype的内部属性，这个属性所对应的就是该对象的原型（原型是一个对象模板）原型链是有一些用来继承和共享属性的对象组成的对象链，并且原型链的长度是有限的（对象之间存在继承关系，在js中是通过prototype对象指向父类对象，直到object对象为止，这样就形成了一个原型指向的链条，我们称之为原型链）举例：student>pe...
2020-02-17 00:51:42
423
原创 MySQL遇到的错误以及解决方案(持续补充)
navicat 连接MySQL数据库报错，错误代码：1251解决方案有两种：升级navicat驱动把mysql用户登录密码加载规则还原成mysql_native_password具体步骤：1、打开命令行dos，进入MySQL的bin目录，然后输入mysql -u root -p，输入密码；或者直接在打开mysql命令行，输入密码2、然后在“mysql>”后输入ALTER ...
2019-11-28 16:17:21
557
原创 mysql数据库
什么是数据库？数据库（Database）是按照数据结构来组织、存储和管理数据的仓库。数据以表格的形式出现每行为各种记录名称每列为记录名称所对应的数据域许多的行和列组成一张表单若干的表单组成数据库（database）MySQL数据库mysql 属于结构性数据库 （表的形式来存储数据）Mysql是开源的，所以不需要支付额外的费用。Mysql支持大型的数据库。可以处理拥有上...
2019-11-27 19:45:03
1255
原创 Node.js Express 框架
Express 框架1.Express框架简介Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用，和丰富的 HTTP 工具。使用 Express 可以快速地搭建一个完整功能的网站。Express 框架核心特性：可以设置中间件来响应 HTTP 请求。定义了路由表用于执行不同的 HTTP 请求动作。可以通过向模板传递参...
2019-11-25 20:19:19
124
原创 node.js（3）
stream流Stream 是一个抽象接口，Node 中有很多对象实现了这个接口。例如，对http 服务器发起请求request 对象就是一个Stream，还有stdout（标准输出）。Node.js，Stream 有四种流类型：Readable - 可读操作。Writable - 可写操作。Duplex - 可读可写操作.Transform - 操作被写入数据，然后读出结果。所...
2019-11-20 17:40:21
167
原创 path模块
path模块__dirname 表示的是获取当前文件所在目录的绝对路径path模块通常会和fs模块配合使用，然后fs模块写路径是配合该模块的方法就变成了绝对路径const path=require("path");module.exports=()=>{ //获取文件的后缀名 let pathname="maodou.json"; let hname=p...
2019-11-19 17:09:11
180
原创 node(2)
node.js中fs模块系统的使用：Node.js 文件系统（fs 模块）模块中的方法均有异步和同步版本，例如读取文件内容的函数有异步的 fs.readFile() 和同步的 fs.readFileSync()。异步的方法函数最后一个参数为回调函数，回调函数的第一个参数包含了错误信息(error)。建议大家使用异步方法，比起同步，异步方法性能更高，速度更快，而且没有阻塞1.读取文件：...
2019-11-19 17:06:51
142
原创 node.js（1）
node.js是什么？Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。Node.js 的出现吸引了很多前端开发人员开始用 JavaScript 开发服务器代码，其异步编程风格也深受开发人员的喜爱。Node.js 的伟大不仅在于拓展了 JavaScript 在服务器端的无限可...
2019-11-18 16:30:56
142
原创 vue事件+vue过滤器
Vue事件指令 v-on 事件类型 @事件类型格式 v-on:eventType="事件处理程序名称" <button v-on:click='normalHandler'>普通事件</button> //简写@click执行的方法有参数 <button @click="getEvent">获取参数</button> ge...
2019-11-13 11:22:57
331
原创 vue常用指令和vue里面使用less
Vue常用指令指令的完整格式v-else //什么都没有，无值v-text="val" //有值v-bind:src="val" //有参，有值v-on:click.stop="val" //有值，有参，有修饰符vue的常用指令：数据绑定、绑定属性、循环渲染数据、数据渲染、显示隐藏。数据绑定 {{ }}<template> &...
2019-11-13 09:37:01
599
原创 vue入门
vue入门1.vue.js是什么？Vue是一个构建用户界面（UI）的渐进式JavaScript框架。2.库框架的区别库，本质上是一些函数的集合。每次调用函数，实现一个特定的功能，接着把控制权交给使用者。例如：jQuery框架，是一套完整的解决方案，使用框架的时候，需要把你的代码放到框架适合的地方框架会在适合的时机调用你的代码。框架规定了自己的编程方式，是一套完整的解决方案。框架的侵入性...
2019-11-12 21:42:20
111
原创 Bootstarp全局css样式
Bootstrap 是移动设备优先的。<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">/*user-scalable=no 可以禁用其缩放（zooming）*/Normalize.css 重置浏览器之间的样式 让浏览器保...
2019-10-24 09:53:05
247
原创 set和map数据结构
set和map数据结构<script> /* * set map集合 * set 集合 里面的值必须唯一 * add set集合追加值 * set 集合没有键 只有值 * */ { let arr=[1,1,2,2,3,3,3,4,4,5,6,3,2,7,6]; let s=new Set(a...
2019-10-16 10:53:26
118
原创 函数的扩展、字符串的扩展方法和正则的扩展
函数的扩展和正则的扩展<script> /* * ES6正则的扩展 * RegExp构造函数 * */ //获取修饰符flags { //如果RegExp构造函数第一个参数是一个正则对象，那么可以使用第二个参数指定修饰符。而且，返回的正则表达式会忽略原有的正则表达式的修饰符，只使用新指定的修饰符。 let...
2019-10-16 10:52:11
131
原创 变量的解构赋值、数组的扩展和对象的扩展
变量的解构赋值<body><button class="btn">按钮</button><button class="btn">按钮</button><button class="btn">按钮</button></body><script>{ /*let a=...
2019-10-16 10:42:45
103
原创 let和const命令
let和const命令<script> /* * ES6的块级作用域必须要有{} * let命令 用来声明变量 只在let命令所在的代码块内有效 * 不存变量提升现象 * 存在暂时性死区，只能在声明的位置后面使用 * */ { let a=10; var b=19; } //co...
2019-10-16 10:33:17
106
原创 js实现别踩白块小游戏
存在问题：隔行也可以点击解决方法：添加一个递归函数。<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> *{ margin:...
2019-10-10 10:43:44
128
原创 js 2048的实现
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=400,maximum-scale=3.0,minimum-scale=0.5,user-scalable=no"> ...
2019-10-10 10:30:22
174
原创 jQuery继承
jQuery继承HTML：<ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li></ul><script src="js/jquery-1.9.1.js"></script>...
2019-10-10 10:15:55
160
原创 jQuery的动画方法
jQuery的动画方法css：<style> .block { width: 100px; height: 100px; background: red; } </style>html：<button id="btn">按钮</button><button id="stop">暂停</button><div c...
2019-10-10 09:55:19
152
原创 jQuery的基础知识学习
jQuery:jQuery 是一个快速、轻量级、可扩展的 js 库，它提供了易于使用的跨浏览器的API，使得访问dom，时间处理、动画效果、ajax请求变得简单。简化了JS对DOM的操作。（写的少做的多）jQuery的引入方式和外部js文件一致jQuery的基本选择器：jQuery支持所有的cs1~cs3选择器html:<style> #btn1 { ...
2019-09-24 09:36:28
134
原创 canvas画布案例（时钟）
时钟源码如下：<html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> canvas{ border: 1px solid #cccccc; } <...
2019-09-18 16:38:18
430
原创 canvas画布
canvas画布画图和图片实现技术：图片FLASHSVGcanvascanvascanvas是：HTML提供的一个用于展示绘图效果的标签，愿以画布，在HTML页面中用于展示绘图效果。canvas基本用法：<canvas>您的浏览器不支持，请更换浏览器</canvas>不要使用css样式设置宽高，应该使用HTML属性。如果使用css样式给canva...
2019-09-18 16:35:44
512
原创 数据缓存的小案例（模拟登录注册和留言缓存）
模拟登录注册<html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> * { margin: 0; padding: 0; } ...
2019-09-17 00:49:57
172
原创 浏览器缓存Cookie,localStorage和sessionStorage
1、Cookiecookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时，就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。支持所有现代浏览器。 var time=new Date("2019 10-01 12:00:00"); document.cookie="user=654321;expires=Tue ...
2019-09-16 11:57:02
281
原创 百度搜索
百度搜索<html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> * { margin: 0; padding: 0; } ...
2019-09-16 11:31:02
897
原创 js节流与防抖
节流函数防抖(debounce)：触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间。函数节流(throttle)：高频事件触发，但在n秒内只会执行一次，所以节流会稀释函数的执行频率。函数节流（throttle）与 函数防抖（debounce）都是为了限制函数的执行频次，以优化函数触发频率过高导致的响应速度跟不上触发频率，出现延迟，假死或卡顿的现象。1、函数...
2019-09-16 11:25:39
153
原创 原生Ajax、Ajax的封装以及Ajax的跨域和跨域原理
原生JS Ajax请求传统方法的缺点:传统的web交互是用户触发一个http请求服务器,然后服务器收到之后,在做出响应到用户,并且返回一个新的页面,每当服务器处理客户端提交的请求时,客户都只能空闲等待,并且哪怕只是一次很小的交互、只需从服务器端得到很简单的一个数据,都要返回一个完整的HTML页,而用户每次都要浪费时间和带宽去重新读取整个页面。这个做法浪费了许多带宽，由于每次应用的交互都需要向服...
2019-09-16 11:10:11
259
原创 前端基础面试题整理（不断更新）
div+css的布局比较table布局有什么优点？改版得时候更方便，只需要改css文件页面加载速度很快、结构化清晰、页面显示简洁表现与结构相分离易于优化对搜索引擎更友好，排名更容易靠前为什么利用多个域名来存储网站资源会更有效？CDN缓存更方便突破浏览器并发执行节约主域名的连接数，优化页面响应速度防止不必要的安全问题简述一下src与href的区别Src是指向物件的来...
2019-09-11 11:08:34
373
1
原创 javaScript写贪吃蛇案例
游戏中有三个对象：地图（map），食物（food），蛇（snack）1.先设计地图，一个简单的div；2.设计蛇的属性：宽，高，方向，状态（有多少节），方法：显示，跑；3.设计食物的属性：宽，高；4.显示蛇：根据状态向地图里加元素5.蛇动起来：下一节到前一节的位置，蛇头根据方向变化，删除原来的蛇，新建蛇；当蛇吃到自己的时候，死亡；6.食物被吃掉，蛇加一节，去掉原来的食物，生产新的食物...
2019-09-10 23:18:40
601
原创 js继承
继承JavaScrip是门面向对象的语言，也有继承的概念。继承有两点有用的服务。1.它是代码重用的一种形式；2.引入类型系统规范。它是门基于原型的语言，意味它的对象可以直接从其他对象继承。（子类继承父类）父类：//es5（类是构造函数写法） es6（class） function Animal(name, sex) { this.name = name || "动物...
2019-09-09 17:20:14
264
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人