- 博客(44)
- 收藏
- 关注
RSS订阅原创 vue+node.js+moogodb仿王者荣耀移动端项目一
一web端首页页面二，新闻资讯详情页面三，admin后台管理界面四，项目目录admin目录view目录web目录serve目录一，web端创建首先创建vue.app中的内容<template> <div id="app"> <router-view/> </div></template...
2019-09-05 23:16:34
913
原创 仿bilibili微信小程序3
七，视频播放页面1.app.json引入detail目录 "pages": [ "pages/index/index", "pages/detail/detail", "components/MyTitle/MyTitle" ],2.引入头部 <MyTitle></MyTitle>3.引入video <view class...
2019-09-05 20:22:32
1156
原创 仿bilibili微信小程序2
轮播图wxml<view class="slides"> <swiper autoplay indicator-dots circular> <swiper-item wx:for="{{swiperList}}" wx:key="{{index}}"> <navigator> <!--Widthfix 宽度不...
2019-09-04 00:07:08
590
原创 仿bilibili微信小程序一
一，项目目录一，页面效果1.首页2，视频播放页三，首页头部公众部分的制作在component目录下的myTitle中wxml<!--components/MyTitle/MyTitle.wxml--><view class="mytitle"> <!-- logo --> <navigator class="logo"...
2019-09-04 00:00:55
1806
4
原创 数据双向绑定与虚拟dom原理
一，数据双向绑定view的变化反映到ViewModel,ViewModel变化同步反映到view上原理：vue数据双向绑定是通过数据劫持，结合发布者-订阅者模式方式实现的二，虚拟DOM原理虚拟dom是为了解决DOM操作过多而导致性能低的问题，直接操作dom,改一次渲染一次，而虚拟dom是用js模拟一棵dom树，每次修改dom，先把虚拟dom修改，最后再一次性把虚拟dom更新，提高性能虚...
2019-09-03 23:19:17
1748
原创 MVVM
MVVMModel 指数据部分，jsview 试图部分 domviewmodel :连接视图与数据部分的中间件通讯view与model不能直接通信，通过viewmodel实现双向通信
2019-09-03 23:08:58
105
原创 nextTick用法与vue常用基础指令
一，nextTick用法当操作数据发生改变，并不会立即执行更新dom操作，而是等事件所有数据都改变才执行操作，故更新一个数据后立即对该数据绑定dom操作可能得不到想要的结果 故使用nextTick解决这种问题例//修改数据vm.msg="hello"Vue.nextTick(function(){//dom更新，此时提供dom有效}）二，vue常用基础指令v-if v-else...
2019-09-03 23:05:58
212
原创 实现一个自定义组件，不同组件间如何通信的？
例:全局组件<body><div id="app"><my-comonpent></my-compinent></div><template id="myTemplate"><div><h3>123</h3></div></template><...
2019-09-03 22:52:38
350
原创 web socket
使用js建立与远程服务器连接，从而允许远程服务器将数据推送给浏览器，websocket使用基于TCP的socket链接，使用websocket后，服务器端与浏览器建立一个socket链接，可以进行一个双向数据传输send();向远程服务器发送数据colse()关闭websocket例var websocket=new websocket("www://127.0.0.1:8000/s/s"...
2019-09-03 22:32:49
197
原创 前端CSRF XSS
一，XSS跨站脚本攻击向有xss漏洞的网站中输入恶意的HTML代码当其他用户浏览该网站时，这段HTML代码会自动执行，从而达到攻击目的理论上，所有可输入的地方，没有对输入数据进行处理都有xss漏洞xss方法编码：对用户输入数据进行HTML 编码过滤：移除用户输入和事件相关的属性校正：避免直接对HTML进行解码，使用DOM Parse转换，校正不配对的DOM标签二，CSRF:...
2019-09-03 22:18:13
153
原创 跨域
跨域指从一个域名网页去请求另一个域名的资源限制跨域访问原因1.安全例如：用户访问网站A，cookie放在浏览器中，用户访问网站B,网站B获取网站A的cookie对网站A发起访问。为什么要跨域可以实现同一个团体内，不同子域间相互访问实现跨域方法Nginx代理A与B应用都通过一个统一地址转发例server{listen 80server-name www,123,top;...
2019-09-03 22:08:12
841
原创 Ajax与Axios
ajax是对原生xhr封装，除此之外还增添了对于JSONP支持例；$.ajax({type:"post",url:url路径data:datadataType:dataType;success:function(data){ console.log(data) } error:function(){} });原生xhr请求var xhr=new XMLHTTPRequ...
2019-09-03 21:47:03
603
原创 GET与POST区别
1.get用来从服务端获取数据，POST用于上传或修改数据2.GET大小限制在2kb以内，POST一般没有限制3.get参数在url,post参数在请求主体中，安全性能post高4，使用XMLHTTPReauest是post需要显示请求头5，get不能保证每次都发送到服务器上，post可以保证。...
2019-09-03 19:03:29
113
原创 计算机网络协议层次划分
网络协议是计算机网络中进行数据交换而建立的规则，将所有的层次的协议集合起来就是协议栈TCP/IP:应用层–>传输层–>网络层–>网络接口层TCP/IP5:应用层–>传输层–>网络层–>{数据链路层–>物理层}OSI:{应用层–>表示层–>会话层}–>传输层–>网络层–>{数据链路层–>物理层}...
2019-09-03 18:51:15
926
原创 CDN
CDN又叫内容分发网络，即让每个地区访问更近一点的网络结点，此节点为CDN节点1.若cdn节点上没有想要的数据，那么该节点就会从dns源站上获取数据，然后在该节点上保存数据缓存。2.若该地区有多个cdn节点，则按负载来判断访问那个cdn节点目前cdn提供商有 阿里云 青牛cdn框架一个智能dns加上若干个cdn节点好处1.访问速度提高2，减轻源站web服务器压力3，使别人无法知道...
2019-09-03 18:44:41
120
原创 DNS解析
DNS层次化，分布式域名系统，提供将域名转化为ip服务加载网页涉及4个DNS服务器，1.DNS recursor:一个服务器，旨在通过web浏览器等应用程序，从客户端计算机接受查询2.根名称服务器，将人类可读的主机名转换为ip地址的第一步3.TLD名称服务器，此名称服务器是搜索特定ip地址下一步，其托管主机名最后一步，（在a,com中，TLD服务器是“com")4.权威名称服务器：查询...
2019-09-03 18:32:37
154
原创 Cookies session SessionStorage与localstorage
一，Cookies session介绍1Cookies让网站服务器把少量数据储存到客户端的硬盘或内存或是从客户端的硬盘读取数据的技术。2Session 会话，指有始有终的一系列消息。用户访问某个域名网站时，若该用户未创键会话，则web服务器自动创建一个session对象，存在服务端，此对象唯一标记在cookie中Sission最常用在登陆注册中二，cookie localstorage ...
2019-09-03 00:15:52
119
原创 防抖与节流
防抖与节流防抖（用于表单提交）某函数在一秒后执行，若在几秒内又有事件被触发了，则重新开始计时function debounce(fn,wait){let timer=null;return function(){If(timer){clearTimeout(timer)}const args=arguments;timer=settimeout(()=>{fn.appl...
2019-09-02 23:57:07
80
原创 重绘与回流
重绘与回流回流：页面中的部分或全部元素，宽高，位置发生变化，删除或增加某个元素时，某个元素隐藏或显示时，页面重新加载重绘：页面中发生可见性变化注：回流必将引起重绘，重绘不一定引起回流。...
2019-09-02 23:55:42
108
原创 从输入url到页面展示发生了什么
1，输入地址2.浏览器查找域名ip地址本地硬盘host文件————有————>使用|无|本地DNS服务器|无|根DNS服务器
2019-09-02 18:32:28
94
原创 map与set
1.Set本身为一个类似于数组构造函数，但set成员值是唯一的没有重复的值例const s=new set();[2,3,5,4,5].forEach(x=>s.add(x));for(let i for s){console.log(i);}//2,3,5,4set函数可以接收一个数组作为参数；例const set=new Set([1,2,3,4,5,5]};[....
2019-09-02 18:31:38
133
原创 箭头函数this的指向问题
普通函数：（谁调用，this指向谁）箭头函数：根据创建时所在的环境（我在那个环境中创建，this就指向那）例Documnet.οnclick=function(){Alert(this);//HTMLDocument}Document.οnclick=()=>{Alert(this);//window}例2：Document.οnclick=function(){Le...
2019-09-02 18:30:40
177
原创 Generator
异步编程有一种叫做”协程“，意为多个线程相互协作完成异步任务协程运行流程一，协程A开始执行二，A执行到一半，进入暂停，执行权交由协程B;三，（一段时间后）协程B交还执行权四，协程A恢复执行例function async(){//其他代码var f=yield readFile(fileA)//..其他代码}yield命令表示执行到此处，执行权交给其他协程，即yield命...
2019-09-01 22:41:34
214
原创 callback回调函数
回调函数：把任务第二段单独写在一个函数里，等到重新执行这个任务时，就直接调用这个函数；例fs.readFile('/etc/passwd',function（err,data){if(err)thow err;console.log(data);});上述代码中readFile函数第二个参数就是回调函数，也是任务第二段，等到操作系统返回了/etc/passwd文件后，回调函数就会执行...
2019-09-01 20:53:52
548
原创 解构赋值
什么是解构赋值语法上就是赋值作用解构是一种结构，右边一种结构，左右一一对应进行赋值分类数组解构赋值，对象解构赋值，字符串解构赋值，布尔值解构赋值，函数解构赋值，数值解构赋值数组解构赋值{let a,b,rest;[a,b]=[1,2];console.log(a,b);}{let a,b,rest;[a,b,....rest]=[1,2,3,4,5,6];}对象解构...
2019-09-01 20:47:57
158
原创 let与const
let1.let声明的变量没有变量提升2.let不允许重复声明3.let声明变量不会给全局对象window增加属性；const1,const声明变量必须赋值2,const声明变量不屑修改3,let的特点const都有...
2019-09-01 20:34:49
146
原创 eventloop
进程与线程一，Javascript为单线程任务队列单线程使得所有任务需要排队，前一个任务结束，才会执行后一个任务，若前一个任务不结束，后一个任务就需等待；任务分为同步任务与异步任务1 同步任务：在单线程上排队执行任务只有前一个任务执行完成，才能执行后一个任务2异步任务：不进入主线程而进入任务队列任务，只有任务队列通知主线程，某些异步任务可以执行了，这些任务才会进入主线程执行。二，...
2019-09-01 20:24:56
185
原创 垃圾回收机制与内存泄漏
1.标记清除2.引用计数1.标记清除标记清除标记出需要清除的，具体原理当变量进入执行环境时，将这个变量标记为进入环境，变量离开环境时，则将其标记为离开环境，标记离开环境时会被收回。工作流程1，垃圾回收器在运行时回给内存中所有变量加上标记。2，去掉环境中的变量，以及被环境中的变量应用的变量的标记。3，再被加上标记的变量会被视为准备删除的变量。4，垃圾回收器完成内存清除，销毁那些...
2019-09-01 20:12:36
200
原创 服务端渲染与前端渲染
服务端渲染1浏览器发送请求给服务器2服务器利用后台引擎渲染直接生成html文件3返回给前端直接插入页面缺点：占用服务器资源前端渲染1浏览器发送请求给服务器，2 服务器返回json数据3前端获得json数据进行读取，拼接字符串，展示页面4 前后端分离...
2019-09-01 19:57:10
267
原创 BOM属性对象方法
1.window(浏览器窗口）属性name:浏览器窗口的名字或框架的名字例：window.name=“new”获取窗口名称document.write(name);top代表最顶层窗口如：window.top;parent:代表父级窗口，主要用于框架self:代表当前窗口，主要用于框架中innerHeight:浏览器窗口内高；innerWidth:浏览器窗口内宽；...
2019-09-01 19:48:39
274
原创 扁平化数组
多维数组===》一维数组法一：递归var arr=[1,[2,3,[4]]];function flatten(arr)var res=[];for(var i=0;i<arr.length,i++){if(Array.isArray[arr[i])){res=res.concat(flatten(arr[i]));}else{res.push(arr[i]);}}r...
2019-09-01 15:49:30
156
原创 数组去重
1.indexof()方法（IE8后）可返回某个指定元素在数组中首次出现的位置，若没有找到，则放回-1；function r(arr){var new=[];for(var i=0;i<arr.length;i++){if(new.indexOf(arr[i]==1){new.push(arr[i]);}}return new;}var arr=[1,2,1,3,4...
2019-09-01 15:39:31
133
原创 设计模式之单例模式
保证一个类仅有一个实例，并提供一个访问他的全局访问点1.实例单例模式用一个变量来标志，当前是否已经为某个类创建过对象，若是，则在下一次获取该类时，直接返回之前的创建对象例var A = { XX: "123", YY: "1234", CC: function() { console.log("hello world"); } }...
2019-09-01 15:13:15
89
原创 立即执行函数
遇到该函数立即执行，只执行一次，执行完后。将函数立即释放。用处：减少缓存，解决闭包问题格式(function(形参){代码处}（实参）};
2019-09-01 14:54:23
112
原创 Promise对象
1.对象状态不受外界影响，Promise对象代表一个异步操作有三种状态pending(进行中）fulfilled(已成功）reject(已失败）then方法是定义在原型对象Promise.prototype上的等待态（pending);promise包装任务正在执行中；完成态（fulfilled),promise包装的异步任务执行了resolve函数拒绝态（rejected);pr...
2019-09-01 14:51:07
96
原创 async/await
async用于申明一个function异步的await用于等待一个异步方法执行完成async优点1，内置执行器2，更好语义3，更广泛适用性带async关键字的函数，使得函数返回值必为promise对象1.await等的是右侧【表达式】结果，右侧表达式执行完后抛出2.宏任务与微任务宏任务是代码主线，遇到了setTimeout会创建一个宏任务遇到promise,then之类的微任务...
2019-09-01 14:37:22
183
原创 apply与call
call().apply()是用括号里的对象来集成括号外函数属性例function add(a,b){alert(a+b);}function sub(a,b){alert(a-b);}add.call(sub,1,1);//值为2，使sub集成了add的函数属性区别：apply：最多有一个数组argArray,若要给该方法添加多个参数，则把参数写进此数组中。call:可...
2019-09-01 14:08:13
106
原创 函数柯里化
主要目的为减少函数传参，同时将一些固定参数私有化把接收多个参数函数变成一个接收一个单一参数的函数，并返回接收剩余参数而且返回结果的新函数的技术例// 普通的add函数function add(x, y) { return x + y}//柯里化var add1=function(x){return function(y){return x+y;}};//函数调用a...
2019-09-01 14:00:57
92
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人