js
木头没有瓜
王者也飘然
展开
-
js vue自动创建blob/binary文件给后端服务器
背景服务器需要(xml)文件,一般文件都是读取的,通过input=file,但是能不能手动创建文件并上传呢,答案是可以的。重头戏、创建blob对象。设置http传输格式。原创 2022-07-25 12:28:09 · 1911 阅读 · 0 评论 -
防抖函数延伸的知识
上代码,看例子function debounce(fn, wait = 50) { // 通过闭包缓存一个定时器 id let timer = null // 将 debounce 处理结果当作函数返回 return function(...args) { if (timer) clearTimeout(timer) // 开始设定一个新的定时器,定时器结束后执行传入的函数 fn timer = setTimeout(()原创 2022-02-28 20:42:48 · 62 阅读 · 0 评论 -
观察者和发布订阅的区别
在观察者模式中,观察者是知道Subject的,Subject一直保持对观察者进行记录。然而,在发布订阅模式中,发布者和订阅者不知道对方的存在。它们只有通过消息代理进行通信。在发布订阅模式中,组件是松散耦合的,正好和观察者模式相反。观察者模式大多数时候是同步的,比如当事件触发,Subject就会去调用观察者的方法。而发布-订阅模 式大多数时候是异步的(使用消息队列)。观察者模式需要在单个应用程序地址空间中实现,而发布-订阅更像交叉应用模式之前一直对观察者模式和发布订阅模式的区别理解不深,正好这原创 2022-02-26 17:16:49 · 339 阅读 · 0 评论 -
Event Loop的过程?promise 定义时传入的函数啥时候执行?
主线程从"任务队列"中读取事件,这个过程是循环不断的,所以整个的这种运行机制又称为Event Loop(事件循环)。用两个队列来处理异步任务。 以setTimeout为代表的任务放到被称为macrotask,放到Macrotask queue中, 而以Promise 为代表的任务放到Microtask queue中。 eventloop对这两个队列的处理逻辑也不一样。执行过程如下: JavaScript引擎首先从macrotask queue中取出第一个任务, 执行完毕后,将microtask qu原创 2022-02-26 17:11:11 · 233 阅读 · 0 评论 -
JS中的逻辑运算符&&、|| 货真请病假
1、JS中的||符号:运算方法:只要“||”前面为false,不管“||”后面是true还是false,都返回“||”后面的值。只要“||”前面为true,不管“||”后面是true还是false,都返回“||”前面的值。总结:或真前假后2、JS中的&&符号:运算方法:只要“&&”前面是false,无论“&&”后面是true还是false,结果都将返“&&”前面的值;只要“&&”前面是true,无原创 2022-02-21 20:29:17 · 130 阅读 · 0 评论 -
Object.prototype.hasOwnProperty 和 set.has
const obj = { 1: "a", 2: "b", 3: "c" };const set = new Set([1, 2, 3, 4, 5]);obj.hasOwnProperty("1"); // trueobj.hasOwnProperty(1); // trueset.has("1"); // falseset.has(1); // true所有对象键(不包括Symbols)都会被存储为字符串,即使你没有给定字符串类型的键。这就是为什么obj.hasOw.原创 2022-02-21 15:44:42 · 500 阅读 · 0 评论 -
js对象比较
function checkAge(data) { if (data === { age: 18 }) { console.log("You are an adult!"); } else if (data == { age: 18 }) { console.log("You are still an adult."); } else { console.log(`Hmm..Yo.原创 2022-02-21 15:39:20 · 1430 阅读 · 0 评论 -
匿名函数this指向以及变量提升
参考文章:https://www.jb51.net/article/161019.htmvar a = 10; (function() { console.log(a) a = 5 console.log(window.a) var a = 20; console.log(a)})()解析:在立即执行函数中,var a = 20; 语句定义了一个局部变量 a,由于js的变量声明提升机制,局部变量a的声明会被提升至立即执行函数的函数体最上方,且.原创 2022-02-21 15:14:54 · 646 阅读 · 0 评论 -
AJAX的理解、AJAX交互过程、如何中断ajax请求
AJAX 的全称是异步的 Javascript 和 XML ,是一种创建快速动态的技术,通过在后台与服务器进行少量数据交互,实现网页的异步更新,在不重新加载整个界面的情况下,做到网页的部分刷新;AJAX 的交互模型( AJAX 的过程)用户发出异步请求; 创建 XMLHttpRequest 对象; 告诉 XMLHttpRequest 对象哪个函数会处理 XMLHttpRequest 对象状态的改变,为此要把对象的 onReadyStateChange 属性设置为响应该事件的 JavaScript 函原创 2022-02-21 10:34:37 · 680 阅读 · 0 评论 -
闭包的理解
闭包的实质是因为函数嵌套而形成的作用域链闭包的定义即:函数 A 内部有一个函数 B,函数 B 可以访问到函数 A 中的变量,那么函数 B 就是闭包原创 2022-02-21 09:51:35 · 351 阅读 · 0 评论 -
匿名函数变量问题
var name = 'World!';(function () { console.log('name ' + name); if (typeof name === 'undefined') { var name = 'Jack'; console.log('Goodbye ' + name); } else { console.log('Hello ' + name); }})();name undefinedGoodbye.原创 2022-02-14 14:32:24 · 357 阅读 · 0 评论 -
this的理解,在javascript中,this是如何工作的
以下代码的结果是什么?请解释你的答案。var fullname = 'John Doe';var obj = { fullname: 'Colin Ihrig', prop: { fullname: 'Aurelio De Rosa', getFullname: function() { return this.fullname; } }}; console.log(obj.prop.getFullname());原创 2022-02-10 12:26:32 · 500 阅读 · 0 评论 -
new 操作符具体干了什么?
new共经历了四个过程。var fn = function () { };var fnObj = new fn();1、创建了一个空对象var obj = new object();2、设置原型链obj._proto_ = fn.prototype;3、让fn的this指向obj,并执行fn的函数体var result = fn.call(obj);4、判断fn的返回值类型,如果是值类型,返回obj。如果是引用类型,就返回这个引用类型的对象。if (typeo原创 2022-02-10 12:21:39 · 1877 阅读 · 0 评论 -
前端页面结构组成
前端页面有哪三层构成,分别是什么?作用是什么?网页分成三个层次,即:结构层、表示层、行为层。网页的结构层:由HTML或XHTML之类的标记语言负责创建,即HTML的语义化。,说白了就是一些标签网页的表示层:说白了就是CSS网页的行为层:说白了就是Javascript语言和DOM主宰的领域。...原创 2022-02-09 21:24:31 · 1130 阅读 · 0 评论 -
javascript实现单例模式
什么是单例模式单:单一, 一个例:实例所谓的单例, 就是指一个类只有一个实例, 不管你 new 多少次, 都是这一个实例具体的实现思路就是:先判断实例是否存在 如果存在则直接将实例返回 如果不存在, 就创建了再返回先看一个普通的实例化function Person() { this.name = '猫'}const p1 = new Person()const p2 = new Person()console.log(p1, p2);console...原创 2022-02-07 18:51:13 · 1705 阅读 · 0 评论 -
setTimeout的工作原理
setTimeout的运行机制是,将指定的代码移出本次执行,等到下一轮Event Loop时,再检查是否到了指定时间。如果到了,就执行对应的代码;如果不到,就等到再下一轮Event Loop时重新判断。这意味着,setTimeout指定的代码,必须等到本次执行的所有代码都执行完,才会执行。每一轮Event Loop时,都会将“任务队列”中需要执行的任务,一次执行完。setTimeout是把任务添加到“任务队列”的尾部。因此,它们实际上要等到当前脚本的所有同步任务执行完,然后再等到本次Event Loop原创 2022-02-07 17:47:16 · 1317 阅读 · 0 评论 -
DOM事件流和事件委托
DOM事件流包括三个阶段:捕获阶段目标阶段冒泡阶段首先发生的是事件捕获,为截获事件提供了机会。然后是实际的目标接收到事件。最后一个是冒泡阶段,在这个阶段对事件做出响应事件发生时会在元素节点之间按照特定的顺序传播,这个传播的过程就是DOM事件流简单的说:事件的传播过程即DOM事件流图为事件流的全过程,从图中我们可以看出:一个完整的事件流是从window开始,最后回到window的一个过程 事件流被分为3个阶段:1-5捕获阶段,5-6:目标阶段,6-10:冒泡阶段提高内存和性能原创 2022-02-07 17:42:35 · 308 阅读 · 0 评论 -
mvvm 是什么
MVVM 基本定义1.MVVM 即 Model-View-ViewModel 的简写。即模型-视图-视图模型。2.模型(Model) 指的是后端传递的数据。3.视图(View)指的是所看到的页面。4.视图模型(ViewModel)是 mvvm 模式的核心,它是连接 view 和 model 的桥梁。它有两个方向:一是将模型(Model)转化成视图 (View),即将后端传递的数据转化成所看到的页面。实现的方式是:数据绑定。 二是将视图 (View)转化成模型(Model),即将所看原创 2022-02-07 17:10:08 · 6278 阅读 · 0 评论 -
原生浏览器分享能力vue
项目1地址:fa-ge/nativeSharedemo1地址:NativeShare demo项目2地址:RedSuper/nativeShare.js · GitHubdemo2地址:NativeShare demo兼容性(毫无疑问是兼容浏览器最多的插件了)移动端几乎所有浏览器都支持分享到QQ和QQ空间 QQ浏览器 UC浏览器 微信自带浏览器(只能设置文案,分享需要用户手动点击右上角) ios QQ自带浏览器(只能设置文案,分享需要用户手动点击右上角) QQ空间APP(只能.原创 2021-12-29 16:26:36 · 1200 阅读 · 0 评论 -
ios、android、h5、小程序等安卓苹果平台终端兼容问题
1、ios日期显示NaNios中js通过getMonth()获取到的日期显示NaN,而在其他地方如pc、安卓都是ok的,这是为什么呢,原来这里有个ios的兼容问题,需要将日期中的“-”替换为“/”var time = new Date("2017-6-21 18:00:00".replace(/-/g,'/'));alert(time.getMonth())//都可以正常显示“6”了......原创 2021-12-14 14:42:45 · 3178 阅读 · 0 评论 -
javascript——原型与原型链-对杠
原文地址:javascript——原型与原型链 - 雅昕 - 博客园一、prototype 在JavaScript中,每个函数都有一个prototype属性,这个属性指向函数的原型对象。 例如: 上述例子中,函数的prototype指向了一个对象,而这个对象正是调用构https://www.cnblogs.com/loveyaxin/p/11151586.html一、prototype在JavaScript中,每个函数都有一个prototype属性,这个属性指向函数的原型对象。例如:fun原创 2021-11-20 17:22:13 · 74 阅读 · 0 评论 -
undefined与null的区别
原文地址:undefined与null的区别 - 阮一峰的网络日志http://www.ruanyifeng.com/blog/2014/03/undefined-vs-null.htmlnull表示"没有对象",即该处不应该有值。典型用法是:(1) 作为函数的参数,表示该函数的参数不是对象。(2) 作为对象原型链的终点。Object.getPrototypeOf(Object.prototype)// nullundefined表示"缺少值",就是此处应该有一个值,但原创 2021-11-20 17:12:43 · 51 阅读 · 0 评论 -
ES6箭头函数的this指向详解
ES6箭头函数的this指向详解先来个总结:箭头函数体内的this对象,就是定义该函数时所在的作用域指向的对象,而不是使用时所在的作用域指向的对象。下面是普通函数的列子:var name = 'window'; // 其实是window.name = 'window'var A = { name: 'A', sayHello: function(){ console.log(this.name) }}A.sayHello();// 输出Avar原创 2021-11-16 10:51:19 · 122 阅读 · 0 评论 -
new操作中发生了什么?
比较直观的感觉,当我们new一个构造函数,得到的实例继承了构造器的构造属性(this.name这些)以及原型上的属性。在《JavaScript模式》这本书中,new的过程说的比较直白,当我们new一个构造器,主要有三步:• 创建一个空对象,将它的引用赋给 this,继承函数的原型。• 通过 this 将属性和方法添加至这个对象• 最后返回 this 指向的新对象,也就是实例(如果没有手动返回其他的对象)例子,大概就是这样:// ES5构造函数let Parent = functi原创 2021-11-16 10:38:36 · 836 阅读 · 0 评论 -
深拷贝的几种实现方法
深拷贝的几种实现方法JSON.stringify 和 JSON.parse用 JSON.stringify 把对象转换成字符串,再用 JSON.parse 把字符串转换成新的对象。可以转成 JSON 格式的对象才能使用这种方法,如果对象中包含 function 或 RegExp 这些就不能用这种方法了。//通过js的内置对象JSON来进行数组对象的深拷贝function deepClone(obj) { let _obj = JSON.stringify(obj); let原创 2021-11-16 10:01:22 · 808 阅读 · 0 评论 -
微信安卓内,vue使用replace(url)不跳转或跳转到内置浏览器
上代码let locationHref = '' if(this.orderType == 'refuel'){ locationHref = `/bdh5std/common.html?fromPage=channelPay&gasOrderNo=${this.orderNo}&orderNo=${this.orderNo}&orderType=${this.orderType}&mobile=${this.原创 2021-11-11 10:23:50 · 2908 阅读 · 0 评论 -
location. reload() 安卓微信内不刷新页面 vue 已解决
this.$router.go(0)换了这个就好了搞了大半天原创 2021-10-16 16:44:08 · 533 阅读 · 0 评论 -
input输入框type设置为number,maxlength无效的vue解决方法
一个小细节,以前很少注意,直到最近做的一个项目,当我把一个输入数字的input框的类型设置为number时,input框还是可以无限输入,设置maxlengh=10就不起作用了。然后我就去百度了一下,type设置为tel时,maxlength就起作用了。为什么呢?这里我先说一下input框type=tel和type=number的区别。首先HTML5加入了新的input类型 number,这是方便数量输入的。如果是在移动端中,属性type=”number”和type=”tel”会唤起系统的数字键盘,这原创 2021-05-29 11:28:35 · 2998 阅读 · 0 评论 -
getTime()在苹果手机上返回NaN的问题
原文地址:https://www.jianshu.com/p/648e71970734今天在项目中的一个js文件中,使用了getTime()的方法来获取毫秒数。但是在手机中运行项目的时候发现,苹果手机获取毫秒数异常。返回NaN。var newStartDate = new Date('2017-08-30');var newStartTime = newStartDate.getTime();这样写在安卓手机上面是正常获取到,但是苹果手机是NaN。所以进行了一下修改var new原创 2021-02-26 10:38:26 · 370 阅读 · 0 评论 -
h5调用第三方支付唤起支付宝支付
// 接口返回的是url地址,h5调用第三方(首易信)支付宝 var winRef = window.open("","_blank"); this.$api.post( url, params, success => { this.$indicator.close(); if (success.status === 10000) { console.l...原创 2021-01-26 16:01:21 · 1514 阅读 · 0 评论 -
JS中Math函数的常用方法
原文地址:https://blog.csdn.net/well2049/article/details/79376210Math是数学函数,但又属于对象数据类型typeof Math=> ‘object’console.dir(Math)查看Math的所有函数方法。1,Math.abs()获取绝对值Math.abs(-12) = 122,Math.ceil() and Math.floor()向上取整和向下取整3,Math.round()四舍五入注意:正数时,包含5...原创 2021-01-12 16:54:14 · 101 阅读 · 0 评论 -
Vue 限制input输入金额 小数点后两位number
限制input输入 小数点后两位number<input type="number" @keydown="handleInput" placeholder="请输入或查看" v-model="item.SalePrice">handleInput(e) { // 通过正则过滤小数点后两位 e.target.value = (e.target.value.match(/^\d*(\.?\d{0,1})/g)[0]) || null},Vue 限制input输入数字 不可.原创 2021-01-12 15:39:02 · 2876 阅读 · 0 评论 -
原型(prototype)、原型链和原型继承
转载1自:https://zhuanlan.zhihu.com/p/35790971转载2自:https://segmentfault.com/a/1190000014717972转载3自:https://blog.csdn.net/qq_33562825/article/details/70670109?utm_source=blogxgwz8转载4自:https://www.pianshen.com/article/7557383774/javascript有两大链条,一条是作用域链,一条是原原创 2020-12-22 15:44:16 · 197 阅读 · 0 评论 -
作用域链
转载自:https://www.cnblogs.com/gaosirs/p/10579059.html一、作用域 在 Javascript 中,作用域分为全局作用域和函数作用域 全局作用域: 代码在程序的任何地方都能被访问,window 对象的内置属性都拥有全局作用域。 函数作用域: 在固定的代码片段才能被访问 例子: 作用域有上下级关系,上下级关系的确定就看函数是在哪个作用域下创建的。如上,fn作用域下创建了bar函数,那么“f...原创 2020-12-22 12:01:02 · 3479 阅读 · 0 评论 -
cdn 加速原理
参考文章1:https://zhuanlan.zhihu.com/p/101949320参考文章2:https://www.jianshu.com/p/1dae6e1680ff什么是cdncdn顾名思义是一个英文缩写,全称是content delivery network(内容分发网络),即服务商通过在世界各地部署大量服务器节点,缓存源站静态资源(目标服务器),当用户访问时返回最优线路的资源,提高网页响应速度,给用户带来更好的体验。有什么好处cdn的核心技术在于智能dns与内容存储,用户访原创 2020-12-22 10:24:00 · 215 阅读 · 0 评论 -
async 和 promise 的区别
Promise,我们了解到promise是ES6为解决异步回调而生,避免出现这种回调地狱,那么为何又需要Async/Await呢?你是不是和我一样对Async/Await感兴趣以及想知道如何使用,下面一起来看看这篇文章:Async/Await替代Promise的6个理由。什么是Async/Awaitasync/await是写异步代码的新方式,使用的方式看起来像同步,以前的方法有回调函原创 2020-12-21 11:43:04 · 5072 阅读 · 3 评论 -
nginx 负载均衡
转载自:https://www.cnblogs.com/alterem/p/11490367.html什么是负载均衡当一台服务器的单位时间内的访问量越大时,服务器压力就越大,大到超过自身承受能力时,服务器就会崩溃。为了避免服务器崩溃,让用户有更好的体验,我们通过负载均衡的方式来分担服务器压力。我们可以建立很多很多服务器,组成一个服务器集群,当用户访问网站时,先访问一个中间服务器,在让这个中间服务器在服务器集群中选择一个压力较小的服务器,然后将该访问请求引入该服务器。如此以来,用户的每次访问,都会原创 2020-12-21 11:41:57 · 92 阅读 · 1 评论 -
cookie和session的区别有哪些
转载自:https://www.cnblogs.com/mark5/p/11641131.htmlcookie和session有着千丝万缕的联系,本文将详细介绍2者的区别。1、存储位置不同cookie的数据信息存放在客户端浏览器上。session的数据信息存放在服务器上。2、存储容量不同单个cookie保存的数据<=4KB,一个站点最多保存20个Cookie。对于session来说并没有上限,但出于对服务器端的性能考虑,session内不要存放过多的东西,并且原创 2020-12-21 11:40:40 · 727 阅读 · 1 评论 -
观察者模式和发布订阅模式的区别
转载自:https://www.jianshu.com/p/594f018b68e7之前一直对观察者模式和发布订阅模式的区别理解不深,正好这段时间在看vue源码的分析,vue数据双向绑定也用到了发布订阅模式,于是又把这两者探究了一番,今天做个笔记加强印象。观察者模式和发布订阅模式最大的区别就是发布订阅模式有个事件调度中心。从图中可以看出,观察者模式中观察者和目标直接进行交互,而发布订阅模式中统一由调度中心进行处理,订阅者和发布者互不干扰。这样一方面实现了解耦,还有就是可以实现更细粒度的一.原创 2020-12-21 11:39:27 · 242 阅读 · 1 评论 -
js 值引用和地址引用
转载自:https://blog.csdn.net/zyddj123/article/details/86636724数字类型 var m = 1000; var n = m; n++; console.log(n); // 1001 console.log(m); // 1000字符串类型 var str = "qwer"; var newstr = str; newstr += "tyu"; console.log(newstr); // qwertyu原创 2020-12-21 11:38:43 · 990 阅读 · 1 评论