晨曦的博客

还可以为这个对象添加一个状态监听函数。一个XMLHttpRequest对象一共有5个状态，当它的状态变化时会触发onreadystatechange事件，可以通过设置监听函数，来处理请求成功后的结果。当对象readystate变为4的时候，代表服务器返回的数据接收完成，这个时候可以判断请求的状态，如果状态是2XX或者304的话则代表返回正常。2.在这个对象上使用open方法创建一个HTTP请求，open方法所需要的参数是请求的方法，请求的地址，是否异步和用户的认证信息。使用promise封装Ajax。

history interface是浏览器历史栈提供的接口，可以通过go，forward，replace等方法获取浏览器历史栈信息，通过pushState()和replaceState()方式修改浏览器历史栈。hash：有#，url不会发送到服务器，刷新不会404，不用服务器配置，#和锚点是同一个意思，所以使用锚点可能会失败，不利于SEO搜索引擎优化。history：没有#，会发送到服务器，发生请求，刷新会404，需要服务器配置一个回调路由，保持域名部分，前端也做的事对对应域名下的路由控制。

深拷贝实现

在src目录下新建common公用方法文件夹用于存放公用方法列表。main.js中引入该文件，并将其添加到Vue原型链上。common下新建common.js。该示例定义存、取、删cookie方法。

【代码】html字符串转换html dom对象。

如上图所示，我们将公用的方法提取到Person原型对象中，每个实例都有一个属性__proto__指向Person原型，这样一来，当下层实例p1、p2需要调用sayHi()方法时，就能够通过__proto__找到上层Person原型对象，从而调用sayHi()方法。有意思的来了，我们可以让Son的原型指向Father的实例，让Father的实例来保存Son的公共方法，而当son想要调用父类的方法时，就可以通过Father实例的__proto__找到Father的原型对象，调用其中的方法。......

就是Promise构造函数是同步执行的,then方法是异步执行的。pending :进行中。resolved:成功。rejected:失败。

代码】快速排序javascript。

1.web Socket 是一种协议,本质和http,tcp一样.它的前缀是ws://或者wss://,后者是加密的.为了使用web Socket,需要在web服务器上运行特殊程序,负责协调前后台通信。特点:无法访问window或者document对象,不能和前台页面共享数据,不影响前台页面任何操作,可以创建多个worker 线程,每个work代码都要放在一个独立的js文件中。2.Web Worker 是一个独立的javascript 线程,运行在后台,适合做费时的大数据计算....

callcall方法在使用一个指定的this值和若干个指定的参数值的前提下调用某个函数或方法 通过call方法我们做到了以下两点:1.call改变this的指向,指向到obj2.fn函数执行了自己手写call方法apply 我们会了call的实现之后,apply就变很简单,他们没有任何区别,除了传参方式bind bind 返回的是一个函数...

array.groupBy,对数组进行分类,假设我们有个员工列表,其中每个员工都一个具有2个属性的对象:name和age

在使用three时导入遇到问题，vue3正确引入OrbitControls：import * as THREE from "three"; //引入Threejsimport { OrbitControls } from "three/examples/jsm/controls/OrbitControls"; //事实证明有用使用：new OrbitControls(camera,renderer.domElement);//创建控件对象中文网那个 new THREE.OrbitControls(came

threejs实现简单全景看房demo

分时函数解决一次性大量数据的情况

优点：requestAnimationFrame会把每一帧中的所有DOM操作集中起来，在一次重绘或回流中就完成，并且重绘或回流的时间间隔紧紧跟随浏览器的刷新频率在隐藏或不可见的元素中，requestAnimationFrame将不会进行重绘或回流，这当然就意味着更少的CPU、GPU和内存使用量requestAnimationFrame是由浏览器专门为动画提供的API，在运行时浏览器会自动优化方法的调用，并且如果页面不是激活状态（不观测页面时不运行）下的话，动画会自动暂停，有效节省了CPU开销总而言之，性能好

非常简陋的写了一串代码，在线编译了测试下，能用，哈哈哈哈哈<template> <div> <Input v-model="baseInfoscurrent" placeholder="Enter something..." /> <Button @click="getallposition"> 点击 </Button> </div> <div class="perso.

<div class="carno-base carno-green" v-html="$options.filters.keywords(text)"></div> filters: { keywords: function (str, key) { //对带有警字车牌加红 key = '警'; let regExp = new RegExp(key, "g"); let newStr = ""; newStr = s.

因为功能需求,需要两种查询组合, <Cascader placeholder="请选择采集点位" ref="Cascader" @on-visible-change="opencader" transfer-class-name="Cascader" :data="allQXList" not-found-text="暂无数据" @on-change="getcode" :load-data="loadData" style="width: 280px" v-model="areacod

而 IE6 IE7 IE8 Firefox Safari 的 JavaScript 解析引擎遵循的是较老的 ECMA-262 第三版规范，属性遍历顺序由属性构建的顺序决定。Chrome Opera 中使用 for-in 语句遍历对象属性时会遵循一个规律：它们会先提取所有 key 的 parseFloat 值为非负整数的属性，然后根据数字顺序对属性排序首先遍历出来，然后按照对象定义的顺序遍历余下的所有属性。解决方法//循环中使用for(let item in this.objectOrder..

data:{ a:1, b:{ c:1 } }, watch:{ a(val, oldVal){//普通的watch监听 console.log("a: "+val, oldVal); }, b:{//深度监听，可监听到对象、数组的变化 handler(val, oldVal){ console.log("b.c: "+val.c, oldVal.c); ..

/** * 创建一个排序函数，包含三个参数 * * @param Array arr: 需要处理的数据 * @param Array newArr: 用于存放处理后的数据 * @param Sting parentId: 当前的需要处理的父亲 parentId * * @param Sting fId: 当前需要处理的孩子 fId * 生成树结构数组 */util.sortArr = function(arr,parentId,fId){ // 创建一个临时数据用于存放数据 var.

_this.$refs.flowContainer.scrollBy({ left:0, top:(_this.$refs.flowContainer.scrollHeight - this.$refs.flowContainer.clientHeight)/2})//_this.$refs.flowContainer 滚动容器

开发功能时恰好需要一个既可以从列表里拖拽到树,又可以树托到列表的功能,后来发现我的需求和我开发的不太一样,因为是二次开发再增加开发不太好搞,所以暂时不要了,但功能开发的还完备.我这里是使用VueDragTreeOrg插件二次开发要求://main.js文件增加//使用插件"vuedraggable": "^2.16.0",npm insatll 安装 或yarn 安装还有什么 stuly等什么报错 是因为版本不对参考:"stylus": "^0.54.8","sty..

Object.assign(target,source)后面覆盖前面

直接看代码imgUrlToFile(url) { var self = this; var imgLink = url; var tempImage = new Image(); //如果图片url是网络url，要加下一句代码 tempImage.crossOrigin = "*"; tempImage.onload = function() { var base64 = self.getBase64Image(tempImage);

var oldArr = [1,2,3,7,8,9,15,17,18,19];//根据这个数组可以得到一下一个二维数组var newArr = [[1,2,3],[7,8,9],[15],[17,18,19]];//方法一function fn(arr){ var result = [],i = 0; result[i] = [arr[0]]; arr.reduce(function(prev,cur){ cur-prev === 1?resu.

/** * * 函数节流 * @param {*} func 函数 * @param {*} wait 时间 * @param {*} type 1:时间戳版 2:定时器版 */ _throttle: function(func, wait, type) { if(type === 1) { var previous = 0; }else if(type === 2) { .

直接上源码吧，还需优化，总感觉不是很流畅<style scoped> * { margin: 0; padding: 0; list-style: none; } .box { width: 400px; height: 200px; margin: 100px auto; position: relative; overflow: h.

以sin 函数为例y = Asin(Bx+C)+D;A 表示振幅，A值越大，振幅越大周期：2Π/B相移：-（C/B）,在B不变的情况下，C为正值时曲线向左移动，C为负值时，曲线向右移动D：是垂直位移，控制曲线上下移动核心代码：for(let x = startX;x<startX+canvasWidth;x+=20/canvasWidth){ const y = waveHeight*Math.sin((startX+x)*waveWidth+xOffset);

outer:for(var i=0;i<20;i++){ inter: for(var j=0;j<40;j++){ if(i>15){ console.log(i); break outer; } } }//print 16

1.Math.sin()的参数,必须是一个弧度表示的角,角度数xMath.PI/180 即为当前角度数的弧度值,30度角的sin()的写法为:Math.sin(30*Math.PI/180)2.180度转换理论上等于Math.PI,但由于cpu在运算的时近似处理,所以并不相等.3.常规代数里,是等于0,当时cpu运算得时候,只是近似与04.计算机语言数值型数据都是二进制表达得,所以在进行通过Math.round()函数来解决.Math.round(Math.sin(Math.PI)*.

原理:1.绘制一个大圆2.绘制饼图3.绘制小圆覆盖或圆形清除

function clearArcFun(x,y,r,cxt){ //(x,y)为要清除的圆的圆心，r为半径，cxt为context var stepClear=1;//别忘记这一步 clearArc(x,y,r); function clearArc(x,y,radius){ var calcWidth=radius-stepClear; var calcHeight=Math.sqrt(radius*radius-calcWidt.

//父组件<mt-loadmore:top-method="istoresh?loadTop:null":bottom-method="loadBottom":bottom-all-loaded="allLoaded"ref="loadmore":autoFill="isAutoFill"><keep-alive> <router-viewclass="page"ref="childcontent"@isrefurbish="isrefurbi...

效果如图:子组件:HeaderTab.vue<template> <div class="header"> <div class="header_search-left"> <!-- <slot name="header_tab_img"></slot> --> </div> <div class="header_tab" ref="headertab">

//今天看到代码突然看到别人的js代码有一个用法if(!!val){ this.value = val}以前只看到!的使用,!null = true!undefined = false!!则用来做类型判断,在第一步!(变量)之后再做逻辑取反运算,在js 中新手(比如我)常常会写这样臃肿的代码:判断变量是否为空,未定义或者非空串var n;if(n != null && typeof(n) != undefined && n != ".

效果如图上图对iview的select进行拓展代码如下<Row> <FormItem label="部门" prop="departments" style="position:relative;"> <!-- 修改 --> <Select placeholder="请输入部门" class="bandelete" v-if="!modal.isread" v-model="model.departments" ref...

在使用v-if 与 v-else-if 与 v-else时候,我们可以使用template,来代替div如<div v-if="isshow"> <div>11</div> <div>222</div></div><script> data:{ isshow:true }</script>//使用template<template v-i

vue-router 同一个页面地址栏参数改变（比如文章的发布和编辑是同一个页面），不会触发vue的created或者mounted钩子，所以数据不会重新渲染。解决办法有两种：1：监听地址栏变化（watch）,这是vue-router官方给出的解决办法。监听路由变化，把初始化的方法重新写到监听的方法里面执行watch: { '$route' (to, from) { this.getData(this.$route.query.id) }}metho.

在项目中,axiso请求,出现几种错误显示问题1.超时请求时原始数据必须清空,否则会以为已经查询出来2.重复按钮点击问题,宁可第二次不给他点击,原因axiso请求是异步,如果两次请求时间第一次大于第二次,导致第一次数据覆盖第二次,显示数据错误.,解决:赋值时间戳,判断两次时间戳是否相同,只取最后一次数据.let sch = new Date().getTime();this.sch = sch;//请求(body=>{ if(sch == this.sch){