- 博客(67)
- 收藏
- 关注
RSS订阅原创 Typescript
一、优点：1、面向对象增强：TS是对面向对象思想进行了增强，使前端变成了强语言类型（强语言类型：不会因赋值而改变数据类型，只能通过强制转换）2、它有更多的规则和类型限制：代码具有更高的预测性、可控性，易于维护和调试；对模块、命名空间和面向对象 的支持，更容易组织代码开发大型复杂程序。3、它是一个超集：它是以JavaScript为基础构建的语言，是一个编译到纯 JS 的有类型定义的 JS 超集，遵循当前以及未来的 ECMAScript规范。不仅能兼容现有的 JS 代码，它也拥有兼容未来版本的。
2021-11-14 15:46:24
463
原创 Typescript配置项
1、编译选项 自动编译文件 编译文件时，使用 -w 指令后，TS编译器会自动监视文件的变化，并在文件发生变化时对文件进行重新编译。 示例： tsc xxx.ts -w 自动编译整个项目 如果直接使用tsc指令，则可以自动将当前项目下的所有ts文件编译为js文件。 但是能直接使用tsc命令的前提时，要先在项目根目录下创建一个ts的配置文件 tsconfig.json tsconfig.json是.
2021-11-14 15:02:45
435
原创 uni-app
特点：vue的语法 + 小程序的标签和api1、cssstyle：静态的样式统一写到 class 中。style 接收动态的样式，在运行时会解析，请尽量避免将静态的样式写进 style 中，以免影响渲染速度。<view :style='{color:color}'> </view>选择器：在 uni-app 中不能使用 * 选择器，page 相当于 body 节点2、生命周期uni-app 完整支持 Vue 实例的生命周期，还新增应用生命周期及页面生命周期，.
2021-11-12 20:55:58
1056
原创 小程序网络请求
ajax封装constajax=(url,method,data)=>{returnnewPromise((resolve,reject)=>{//显示loadingwx.showLoading({title:'加载中',})wx.request({url:url,//仅为示例，并非真实的接口地址method:method,data:da...
2021-11-11 10:50:08
1345
原创 小程序事件绑定 传值和路由
自定义事件1、事件绑定最主要是tap事件，相当于click通过属性绑定事件其有两种写法 绑定冒泡事件（不会帮我们阻止冒泡）【主要】 语法：bind事件类型="方法名" 方法名不能加括号，而且不能传参 绑定非冒泡事件（会帮我们阻止冒泡） 语法：catch事件类型="方法名" 方法名不能加括号，而且不能传参 2、事件对象在小程序中，事件对象是给事件处理程序传递参数的唯一方式。标签上使用data-数据名=“数据值”的形式传递<!-- 传递参数100 -
2021-11-10 09:46:58
973
原创 小程序 入门
1、小程序文件目录： 文件 必填 作用 app.js 是 小程序逻辑-小程序入口文件 app.json 是 小程序公共配置文件 app.wxss 否 小程序公共样式表 一个小程序page页面由四个文件组成，分别是： 文件类型
2021-11-09 09:36:28
130
原创 vuex 使用
一、介绍（npm install vuex --save // 安装）vuex 是vue 配套的数据管理工具，我们可以将组件共享数据保存到vuex 中，方便整个程序中得任何组件都可以获取和修改 vuex 中保存得公共数据二、使用一定要记得将创建的实例挂载到全局实例中，才能在不同页面中访问到//第一步： 引入vueximport Vuex from 'vuex'Vue.use(Vuex)//第二步：创建store实例对象const store = new Vuex.Store({
2021-10-28 21:49:14
93
原创 vue完善&路由守卫
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do...
2021-10-27 21:24:57
91
原创 vue路由partone
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do...
2021-10-26 22:34:26
103
原创 传值、插槽和vue工程化
1、兄弟间传值兄弟组件传值步骤： 第一步：创建中转站 eventBus = new Vue() 第二步：在兄弟组件1 通过事件或生命周期函数 触发 eventBus.$emit('自定义事件', 参数) 第三步：在兄弟2组件中的生命周期函数中 使用 eventBus.$on('transfer', (m) => {}) m 即为传过来的数据<body> <div id="app"> <p>{{msg}}&l...
2021-10-25 21:40:51
130
原创 父子间传值
1、全局组件全局组件 注册全局组件： Vue.component('组件名',{template:"标签模板"}) 全局组件可以在不同的实例中使用 注意：组件名如果是驼峰写法 使用时必须 global-child 格式 注意：模板标签必须有一个根标签 组件中的数据必须是函数返回形式 组件中也可以添加事件 @click='handleClick'局部组件 注意：只能在当前的组件实例对象中使用 注意：组件名如果是驼峰写法...
2021-10-24 18:24:22
1669
原创 vue 请求拦截
一、常用属性1.生命周期：从vue实例产生开始到vue实例被销毁这段时间所经历的过程。<body> <div id='app'> <p id='p1' @click='handleClick'>{{msg}}</p> </div></body><script> const vm = new Vue({ el: '#app', data: { msg: '迈开大步匆...
2021-10-21 22:56:28
2372
原创 vue常用属性
1、自定义指令 指令作用：对dom元素进行操作 bind(在指定绑定到标签上执行) inserted(标签插入到父节点执行) update(标签上的数据更新的时候触发)<script>//不传参数Vue.directive('red',{ bind(el){ el.style.color = 'red' }, inserted(el){ console.log(222,el); }, update(el) {...
2021-10-21 08:22:33
654
原创 vue v-model
循环指令 v-for根据一组数组或对象的选项列表进行渲染。<body> <div id ='app' v-cloak> <input type="text"><button @click = 'add '>添加</button> <ul> <li v-for = '(v,i,key) in listArr' :key='v.id'> <input type="c...
2021-10-19 20:31:16
162
原创 vue部分指令
插值表达式 1.{{msg }} 2.{{msg+'狮子'}} 进行字符拼接 3. {{num+100}} 计算 4. {{name.substr(0,3)}} js 函数 5.{{age>18?'成年':'未成年'}} 三目运算符指令v-text 填充纯文本 相当于之前原生的innerHTML 相比插值表达式更加简洁 不存在插值表达式的闪动问题 <div id='app'> <!-- 插值表达式此时与...
2021-10-18 19:44:31
200
原创 mongo的基本操作
基本操作命令操作 ----- maogo退出mongoDB使用exit查看所有的数据库列表 ---- show dbs创建数据库或切换数据库 --- use 数据库名 可以使用db命令来查看当前所在的数据库名称增删改查增# 添加单条文档数据 db.表名/集合名.insertOne({ key: value , key: value...}) # 添加多条文档数据 db.表名/集合名.insertMany([{}, {}, {}]
2021-10-14 21:19:13
502
原创 express 搭建web服务器&nodejs2
自定义模块可以让一个js中导入另一个js中的数据，导入语法：require(被导入的文件路径)注意：1.被导入的文件路径如果有./则必须加，不加系统会默认为内置模块2.被导入的文件路径中的文件后缀可以省略导出语法：exports.键 = 值 module.exports.键 = 值 module.exports = {}注意：1.导出的时候不能直接给exports赋值。2.导出数据都是以对象的形式导出的，导入进去的也都是对象。yarn//下载...
2021-10-12 19:55:47
131
原创 nodejs扩展1
写入文件// 追加写入fs.appendFile('./a.txt', 'abcdef', err=>{ if(!err){ console.log("成功"); }})console.log(1111);//同步写入fs.appendFileSync('./a.txt', 'hello nodejs')console.log("成功");console.log(1111);运行结果：// 判断指定的文件是否存在的let bool ...
2021-10-11 21:40:10
268
原创 git使用
git版本控制工具-让一个文件中写的项目。每次写好都形成一个版本-保存了开发项目的每个过程上传下载工具gitee.com-只能用git工具来上传下载的网站-服务器在国内类似于百度网盘的网站-一般只能存代码像百度贴吧-可以跟别人互动github.com-服务器在国外-放的是全世界程序员的代码操作跟gitee是一样的推送-上传(提交)同步/拉取-将本地的内容跟远程保持同步仓库-用来存代码的地方远程仓库-远程服务器上被git管...
2021-09-24 20:24:43
102
原创 gulp（压缩文件工具）
项目做好了，需要上线的时候 项目中有很多js、css等文件需要处理压缩文件、合并文件、压缩图片-工具来处理打包工具-自动化项目构建工具：grunt、webpack、gulp简单实用查看任何一个文档 - 首先应该查看：快速入门、快速上手。。。下载工具： npm i -g gulp进入项目文件夹，初始化命令：npm init -y下载写代码需要依赖的第三方模块：npm i gulp检测版本：gulp -v如果出现了两个版本号，说明安装成功在刚刚创建好...
2021-09-24 10:09:41
259
原创 canvas 画布工具
画弧线：工具箱.arc(圆心x,圆心y,半径,开始角度对应的弧度,结束角度对应的弧度)圆形的周长=多少弧度2πr/r=2π360度有2π个弧度1度有多少弧度-π/18090度的弧度-90*π/180demo：饼图效果<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Doc...
2021-09-23 21:32:59
321
原创 nodejs和cookie
nodejs导入导出数据//a.js文件 vara=10 varb=20 exports.a=a exports.b=b //b.js文件 varobj=require('./a') console.log(obj);结果：fs写入文件nodejs内部封装了fs模块-专门用于操作文件的使用内置的fs模块，第一个必须先导入fs模块覆盖写入，文件不存在，会自动创建-异步写入//fs.writeFile是异步操作 varfs=requir...
2021-09-23 09:39:12
147
原创 sass和canvas
介绍css编写时权重难以控制，嵌套层级多导致代码编写不方便。sass的出现就是为了解决css的缺点。sass不能直接被浏览器识别，所以需要进行编译成正常的css文件才能被浏览器使用。sass文件的后缀有两种：1..sass-嵌套关系不用{}，用缩进来表示的2..scss-跟css的写法是一样的sass不能直接被html引入使用，浏览器不能识别这种类型的文件和这种语法sass文件需要编译成css文件才能用npm中有一个工具，专门用来编译...
2021-09-22 21:30:59
159
原创 jQuery发送请求 node npm相关
get请求$.get()-发送get请求//参数1：请求地址-必填项//参数2：请求主体-可选项//请求主体可以是字符串，可以是对象//参数3：成功的回调函数-可选项//参数4：希望返回的数据格式-text/json-默认自动识别数据$.get('http://localhost:8888/test/third',{name:"张三",age:12},function(res){console.log(res);})...
2021-09-17 21:13:02
196
原创 jQuery PartTwo
元素节点操作1、插入//创建节点/*语法：$('完整的标签')*/var$div=$('<divclass="box"style="width:100px;height:100px;background-color:Red;">盒子</div>')//将新标签插入父标签的末尾-append//父.append(新的标签)//$('body').append($div)//新的标签.appendTo(父标签)$div.appen...
2021-09-16 17:06:20
93
原创 jQuery partone
介绍jQuery是js的库。库就是说将很多js的方法封装在了一个文件中。优势：1、强大的选择器机制2、优质的隐式迭代3、无所不能的链式编程jquery完全不需要考虑兼容性，因为jquery库将js的兼容都封装好了步骤首先检测一下有没有引入成功，就是输出$或者就jQuery。这是jQuery暴露在全局的唯一的两个函数。注意：1.jquery获取到的元素统统都是伪数组2.jquery获取到的伪数组不能使用原生js的dom操作，除非取下标获取到精准的dom元素，才能进行
2021-09-15 17:24:23
84
原创 设计者模式 数据塌陷
单例模式正常情况，一个类创建出来的每个对象都是不一样的。class Carousel{ } var a = new Carousel(); var b = new Carousel(); console.log(a === b); // false单例模式就是让这两个对象是一样的，也就是说，一个类永远只有一个实例对象var single = (function(){ class Carousel{ } var res = undefined;
2021-09-14 17:14:30
136
原创 闭包和es6继承
闭包一般函数：function fn(){ var num = 1; return ++num;}var n1 = fn();console.log(n1); // 2var n2 = fn();console.log(n2); // 2闭包函数：function fun(){ var num=1; return function(){ return ++num; }}var fn = fun();fn(); //
2021-09-13 15:31:20
69
原创 跨域和http协议
HTTP的请求只能是客户端向服务器发起。33第一步：建立连接（三次握手）第二步：开始通信通信中又分为客户端对服务器请求请求要遵循请求报文的要求请求报文：请求行：请求方式/请求路径/协议版本POST /user HTTP/1.1 # POST 请求方式 # /user 请求URL（不包含域名） # HTTP/1.1 请求协议版本请求头：键值对user-agent: Mozilla/5.0 # 产生请求的浏览器信息 accept: application/json # 表
2021-09-10 10:10:06
280
原创 async/await
解决回调地狱的终极方法es7（2016版本）中的 async/await关键字async是写在函数定义前面的-function关键字前面-修饰函数-对函数没有影响await必须写在被async修饰的函数，放在一个promise对象的前面-等待promise(异步)的执行-等待promise执行结束-调用resolve，调用resolve的时候通常会传入数据，await就可以将数据接收到(asyncfunction(){varres1=awaitp...
2021-09-08 19:14:17
61
原创 promise
对象转成字符串varobj={ name:"张三", age:12 }第一种方式；遍历对象，用等号连接键和值，将其放入数组中，用join方法拼接字符串vararr=[];for(varattrinobj){arr.push(attr+'='+obj[attr])}//name = 张三，age = 12console.log(arr);varstr=arr.join("&")console.log(str)...
2021-09-08 19:10:35
497
原创 ajax使用
ajax的写法ajax对象：asyncjavascriptandxml-异步的js和xml1.创建对象varxhr=newXMLHttpRequest2.xhr.open(请求方式(get/post),请求地址)//照文档中来参数1：请求方式：get/post参数2：请求地址-url网址参数3：可选项3.xhr.send()4.监听xhr.onreadystatechange=function(){//...
2021-09-07 08:58:05
86
原创 放大镜demo
使用一张图完成效果<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> * { margin: 0; padding: 0; } .middleBox { width: 400px; height:
2021-09-02 22:13:44
92
原创 分页demo
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <table border=1 width="500" align="center"> <thead> <tr> .
2021-09-01 22:00:17
115
原创 面向对象oop
面向对象（OOP）：不注重过程-注重这件事有几个对象在参与三大特性：1.封装性2.继承性3.多态性1、对象的创建varobj={}varpbj=newObject()创建多个对象后，发现如果多个对象的结构一致的，多个对象的创建代码就是重复的-使用循环没有办法处理的，使用函数来处理重复functioncreateObj(name,age,sex){//工厂函数varobj2={name,...
2021-08-31 20:03:01
88
原创 DOM高级 轮播图
将运动封装成函数functionanimate(ele,obj,fn=function(){}){varnum=0vark=0for(letattrinobj){num++lettarget=obj[attr]letl=getStyle(ele,attr);if(attr==='opacity'){l*=100...
2021-08-30 16:36:43
137
原创 es6及this关键字
！！！数组新增的方法some - 判断数组中是否至少有一个元素是满足指定条件的，返回布尔值some内置的原理，遍历数组，判断每个值是否满足条件，有满足的就返回true，并break循环，遍历完以后都 没有一个是满足的，返回false布尔值 = 数组.some(function(v,i,a){//v是元素的值，i是下标，a是当前元素属于的数组对象（可选）return 条件;})// 上面的i和a是可选参数every - 判断数组中是否所有元素都满足指定的条件，返回布尔值eve..
2021-08-27 17:58:05
208
原创 正则表达式
正则表达式的作用1. 提取字符串：从指定的字符串中将符合规则部分提取出来2. 匹配正则：判断一个字符串是否跟指定的规则匹配3. 替换字符串：将一个字符串中跟规则匹配的部分替换掉使用说明：正则表达式比较特殊，不是字符串，不用加引号，但是要有定界符，两边都是斜杠。在斜杠后面可以加一 些特定的修饰符[ ] 字符串用中括号括起来，表示匹配其中的任一字符，相当于或的意思[^] 匹配除中括号以内的内容\ 转义符| 或者，选择两者中的一个。注意|将左右两边分为两部分，而不管左右
2021-08-26 16:55:39
161
原创 事件绑定下
通用的绑定和解绑事件//绑定函数function bind(ele,type,callback){ if(ele.addEventListener){ ele.addEventListener(type,callback,false); }else if(ele.detachEvent){ ele.attachEvent("on"+type,callback); }else{ ele["on" + type] = callback; }}//ele：将
2021-08-25 16:40:56
60
原创 事件绑定上
事件复习（见8.13函数下的事件）事件三要素： 事件源 + 事件名称 + 事件处理程序语法：事件源.on事件类型=函数事件源 : 谁触发这个事件 (按钮 btn) 事件名称 : 触发了什么事件 (点击click事件) 事件处理程序 : 事件触发后要执行的代码(函数形式)----可以是有名字的函数，要不要加小括号？不加鼠标：单击：click 双击：dblclick 移入：mouseover 移出：mouseout键盘：按下键盘：keydown 抬起键盘：keyup表单事件：...
2021-08-24 22:55:26
86
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人