![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js
Mountain08
向上的路其实并不拥挤,就像出地铁站时的扶梯和楼梯。
展开
-
js数组去重
includes 可以检测 NaN,内部使用了Number.isNaN 进行匹配, indexOf 不能检测 NaN。原创 2022-11-14 09:52:14 · 113 阅读 · 0 评论 -
Ajax,Axios,Fetch区别
Fetch:是 window 的一个方法,也是基于 Promise, 但是和 XHR 无关,不支持 IE。Ajax:是对 XMLHttpRequest 对象的封装。Axios:是基于 Promise 对 XHR 的封装。原创 2022-11-14 09:39:07 · 94 阅读 · 0 评论 -
记录Form表单使用i-switch 报错 Value should be trueValue or falseValue.
<FormItem label="设为置顶:" prop="topStatus"> <i-switch @on-change="topStatusChange" v-model="formValidate.topStatus"> <span slot="open">开</span> <span slot="close">关</span> </i-switch></FormItem>js:data原创 2021-11-09 11:40:20 · 1617 阅读 · 0 评论 -
vue滚动抽奖
HTML<template><div id="app"> <div id="container" class="container"> <transition name="bounce"> <template> <div v-show="luckyDrawShow" id="luckyDraw" class="luckyDraw">原创 2021-02-04 17:09:43 · 2270 阅读 · 1 评论 -
js常用的深拷贝
/*第一种*/var clone = function (obj) { if(obj === null) return null if(typeof obj !== 'object') return obj; if(obj.constructor===Date) return new Date(obj); var newObj = new obj.constructor .原创 2020-09-09 14:28:27 · 118 阅读 · 1 评论 -
JS实现遍历不规则多维数组的方法
我们有时候处理数据,可能会遇到一些不规则,那么拿到这种数据我们如何进行遍历操作呢?举个栗子:我们现在有这样的数据:let arr = [ { title: '一一级', key: '一一级key', children: [ { title: '一二级', key: '一二级key', children: [ { title: '一三级', key: '一三级key',原创 2020-05-27 16:05:34 · 1090 阅读 · 0 评论 -
JavaScript Class介绍以及使用方法(代码说明)
Class学过Java的小伙伴会发现, 这个class和Java里的class基本语法并没有什么区别… 下面正式开始介绍.定义类JavaScript 语言的传统方法是通过构造函数,定义并生成新对象。//例: function Point (x,y) { this.x = x; this.y = y; } ...转载 2020-04-27 15:52:50 · 233 阅读 · 0 评论 -
JS CLASS类
1、ES6提供了更接近传统语言的写法,引入了Class(类)这个概念,作为对象的模板。通过class关键字,可以定义类。2、//定义类class Point { constructor(x, y) { this.x = x; this.y = y; } toString() { return '(' + this.x + ', ' + th...转载 2020-04-27 15:51:57 · 155 阅读 · 0 评论 -
es6数组循环
先说说es5的循环,一下几种循环的前五种接收的参数是一样的,都是两个参数:第一个参数:循环里面执行的回调函数,循环调用执行的语句第二个参数:this的指向循环中回调函数的参数有三个:第一个参数:循环出来的值第二个参数:循环出来的索引值第三个参数:数组本身1.forEach()let arr = ['东','京','很','热'];arr.forEach(function(val,...原创 2020-03-05 10:54:25 · 3787 阅读 · 0 评论 -
高德地图报Uncaught TypeError: Cannot read property 'addressComponent' of undefined的解决办法
1、在使使用画图的时候一直报Uncaught TypeError: Cannot read property 'addressComponent' of undefined这个错误,如下图:2、经过分析错误及到百度上查找最终发现在使用Key必须为Web端(JSAPI)这个类型,不然就会跟域名解析对不上。如下图:3、更改之后效果...原创 2019-12-25 15:44:16 · 5264 阅读 · 4 评论 -
数组对象根据某个值相同合并数组
var arr = [ {"id":"1001","name":"值1","value":"111"}, {"id":"1001","name":"值1","value":"11111"}, {"id":"1002","name":"值2","value":"25462"}, {"id":"1002"...转载 2019-10-30 20:54:48 · 1524 阅读 · 0 评论 -
http状态码记录
1、三至七种最基本的响应代码 200("OK") 一切正常。实体主体中的文档(若存在的话)是某资源的表示。 400("Bad Request") 客户端方面的问题。实体主题中的文档(若存在的话)是一个错误消息。希望客户端能够理解此错误消息,并改正问题。 500("Internal Server Error") 服务期方面的问题。实体主体中的文档(如果存在的话)是一个...转载 2019-10-22 15:20:10 · 193 阅读 · 0 评论 -
页面常见布局+知名网站实例分析+相关阅读推荐
from github: github.com/Sweet-KK/cs…目录注:PC端推荐用法后面加▲,至于移动端在兼容性允许的情况下优先考虑flex一、水平居中 (1)文本/行内元素/行内块级元素▲ (2)单个块级元素▲ (3)多个块级元素 (4)使用绝对定位实现▲ (5)任意个元素(flex) ★本章小结:二、垂直居中 (1)单行文本/行内元素/行内块级元素▲ (2)多行文本/行内元素/行内块...转载 2018-03-15 13:48:39 · 568 阅读 · 0 评论 -
图片预加载和懒加载demo
预加载<!DOCTYPE html><html><head> <title>图片无序预加载-优化</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-wi原创 2018-03-28 17:24:06 · 923 阅读 · 0 评论 -
自己动手实现一个MVVM库
自己动手实现一个MVVM库我们知道的,常见的数据绑定的实现方法1、数据劫持(vue):通过Object.defineProperty()去劫持数据每个属性对应的getter和setter2、脏值检测(angular):通过特定事件比如input,change,xhr请求等进行脏值检测。3、发布-订阅模式(backbone):通过发布消息,订阅消息进行数据和视图的绑定监听。具体代码实现...转载 2019-03-06 14:02:38 · 315 阅读 · 0 评论 -
vue iview icon不能点击&JS取出两个数组的不同或相同元素&js一次性删除数组中多个元素&如何使用router-link对象方式传递参数
解决1:我的解决方法是外边包了一层span标签。将点击事件加到span标签上。解决2::原生事件要加修饰符。<Icon @click.native="handleClickFunction">1、取出两个数组的不同元素getArrDifference(arr1, arr2) { return arr1.concat(arr2).filter(functi...原创 2019-04-23 11:33:01 · 425 阅读 · 0 评论 -
JavaScript 数组操作方法 和 ES5数组拓展
JavaScript中数组有各种操作方法,以下通过举例来说明各种方法的使用:数组操作方法push在数组最后添加一个元素var arr=[3,4,5,6]console.log(arr) //[3, 4, 5, 6]arr.push("evenyao") //字符串需要加"",数字不加console.log(arr) //[3, 4, 5, 6, "evenyao...转载 2019-04-23 11:35:55 · 202 阅读 · 0 评论 -
小程序做签名功能生成签名后生成海报上传到服务端
以上是效果图:wxml:<canvas class="canvas" id="canvas" canvas-id="canvas" disable-scroll="true" bindtouchstart="canvasStart" bindtouchmove="canvasMove" bindtouchend="canvasEnd" touchcancel="canvasEn...原创 2019-07-26 16:17:48 · 1554 阅读 · 6 评论 -
iview2----- 表单密码验证
<Form ref="loginForm" :model="form" :rules="rules"> <FormItem label="新密码" prop="password"> <Input v-model="formItem.password" type="password"/> </FormItem> <Fo...原创 2019-08-07 10:21:26 · 513 阅读 · 0 评论 -
前端面试题总结
前端和计算机相关知识你能描述一下渐进增强和优雅降级之间的不同吗浏览器兼容问题如何对网站的文件和资源进行优化?怎么学习前端?怎么接触前端新知识?关于前后端分离关于浏览器内核(渲染引擎)浏览器加载文件顺序以及repaint/reflow为什么使用多个域名来存储网络资源会更有效?进程和线程的区别前端开发的优化问题Flash,Ajax各自的优缺点,使用中如何取舍?CSSCSS3css居中的方式请写一个简单...原创 2018-03-21 10:40:54 · 530 阅读 · 0 评论 -
js模仿打字效果的方法
模仿打字效果: function typing(){ var divTyping = $('.txt2'); if (i <= mobile.length) { divTyping.html( mobile.slice(0, i++) + '_'); setTimeout('typing()', 100);//递归调用 } else{ ...原创 2018-03-14 16:46:38 · 754 阅读 · 0 评论 -
微信小程序开发及面试
一: 参数传值的方法1: data-id我们可以给HTML元素添加data-*属性来传递我们需要的值,使用方法说明: (1)设置data-id<view class="block" bindtap="playTap" data-id="{{modle.id}}">1(2): 取值 + 传值playTap:function(e) { const dataset = e.cu...转载 2018-03-19 10:56:54 · 4942 阅读 · 0 评论 -
前端模块化:CommonJS,AMD,CMD,ES6
模块化的开发方式可以提高代码复用率,方便进行代码的管理。通常一个文件就是一个模块,有自己的作用域,只向外暴露特定的变量和函数。目前流行的js模块化规范有CommonJS、AMD、CMD以及ES6的模块系统。参见阮一峰老师的文章 module-loader 。一、CommonJSNode.js是commonJS规范的主要实践者,它有四个重要的环境变量为模块化的实现提供支持:module、export...转载 2018-03-16 16:40:46 · 256 阅读 · 0 评论 -
JavaScript变量的生命周期:let为什么不被提升
原文链接提升实际上是把变量和函数定义移动到作用域顶部的过程,通常发生在变量声明var或函数声明function fun() {...} 。当let(包括和let有同样声明行为的const和class)被ES2015提出来的时候,包括我在内的许多开发人员都使用提升来描述变量是如何被访问的。但是在对这个问题进行更多的搜索之后,让我惊讶的是,提升并不是描述let变量初始化和可用性的正确术语。ES2015...转载 2018-03-16 09:56:10 · 937 阅读 · 0 评论 -
js(面试题)
shuffle:顾名思义,将数组随机排序,常在开发中用作实现随机功能。我们来看看一个 shuffle 可以体现出什么代码品味。错误举例function shuffle(arr) { arr.sort(function () { return Math.random() - 0.5; });}// ES6const shuffle = (arr) => { ...原创 2018-03-15 13:39:10 · 880 阅读 · 0 评论 -
用JavaScript写一个区块链
原文几乎每个人都听说过像比特币和以太币这样的加密货币,但是只有极少数人懂得隐藏在它们背后的技术。在这篇博客中,我将会用JavaScript来创建一个简单的区块链来演示它们的内部究竟是如何工作的。我将会称之为SavjeeCoin!全文分为三个部分:part1:实现一个基本的区块链part2:实现POWpart3:交易与挖矿奖励Part1:实现一个基本的区块链区块链区块链是由一个个任何人都可以访问的区...转载 2018-03-15 13:32:58 · 399 阅读 · 1 评论 -
深度解析原型中的各个难点
本文不会过多介绍基础知识,而是把重点放在原型的各个难点上。大家可以先仔细分析下该图,然后让我们进入主题prototype首先来介绍下 prototype 属性。这是一个显式原型属性,只有函数才拥有该属性。基本上所有函数都有这个属性,但是也有一个例外let fun = Function.prototype.bind()如果你以上述方法创建一个函数,那么可以发现这个函数是不具有 prototype ...转载 2018-03-15 13:24:55 · 846 阅读 · 0 评论 -
小程序总结和用户授权
1:小程序中没有DOM和BOM对象,固然也就没有jquery和zeipto;2: 小程序中元素在模拟编辑器上可以用length属性,但是手机上不可用length;length属性用for in 循环解决3:全局变量的问题,存储全局变量直接app.globalData=“”即可,也可以存储在storage中,防止异步调用获取不到的问题,所以存取建议都用同步的,加后缀Sync;4:封装方法体,需要写到...原创 2018-03-15 13:21:01 · 5183 阅读 · 1 评论 -
微信小程序事件处理
一、什么是事件?1.一种用户的行为用户长按某一张图片,点击某个按钮,这就是用户的行为,也是事件2.一种通讯方式为什么说事件也是一种通讯方式呢?因为用户点击按钮的时候,这是发生在UI层的,我们的UI要把一些信息发送给我们的逻辑代码,因此也是一种通讯方式二、事件的类别1.点击事件tap2.长按事件longtab3.触摸事件(1)touchstart 开始触摸(2)touchend 结束触摸(3)tou...转载 2018-03-19 10:57:46 · 1036 阅读 · 0 评论 -
前端面试题(2018)
Q:什么情况下会碰到跨域问题?有哪些解决方法?跨域问题是这是浏览器为了安全实施的同源策略导致的,同源策略限制了来自不同源的document、脚本,同源的意思就是两个URL的域名、协议、端口要完全相同。script标签jsonp跨域、nginx反向代理、node.js中间件代理跨域、后端在头部信息设置安全域名、后端在服务器上设置cors。$.fn是什么意思?$.fn是指jquery的命名空间,加上f...转载 2018-03-19 17:17:04 · 18621 阅读 · 0 评论 -
跨域
jsonp:$(function(){ $.ajax({ async: false, type: "GET", dataType: 'jsonp', jsonp: 'callback', jsonpCallback: 'callbackfunction', url: "http://i2.mediapower.mobi/adpower/vm/Bora/js/t...原创 2018-03-14 16:37:38 · 235 阅读 · 0 评论 -
js常用
创建变量: var p=3.14;数据类型: string,number,boolean,arry,obj,null,undefined;对象: javascript中的所有事物都是对象:字符串,数组,日期等等。在javascript中,对象是拥有属性和方法的数据;函数: 函数是由事件驱动的或者当它被调用是执行的可重复使用的代码块。spli...原创 2018-03-14 16:31:30 · 282 阅读 · 0 评论 -
WebSocket
实例内容今天主要说一下微信的WebSocket接口以及在小程序中的使用。WebSocket是什么(简述)微信的WebSocket接口和HTML5的WebSocket基本一样,是HTTP协议升级来的,做为一个新的Socket在B/S上使用,它实现了浏览器与服务器全双工通信。因为这里是做小程序,所以就不对WebSocket的底层和协议做过多的说明了,只是稍微介绍一下。想了解详细的WebSocket可以...转载 2018-03-20 11:54:17 · 240 阅读 · 0 评论 -
WebSocket简介
WebSocket 协议此文仅作为 RFC6455 的学习笔记。篇幅太长超过了简书的单篇最大长度,故分为两篇,此篇记录 1~4 节,其余见 WebSocket 协议 5~10 节;1.1 背景知识由于历史原因,在创建一个具有双向通信机制的 web 应用程序时,需要利用到 HTTP 轮询的方式。围绕轮询产生了 “短轮询” 和 “长轮询”。短轮询浏览器赋予了脚本网络通信的编程接口 XMLHttpReq...转载 2018-03-20 11:52:20 · 372 阅读 · 0 评论 -
使用Vue写一个图片轮播组件
在制作这个组件之前,笔者google了不少关于轮播的文章,发现实现一个轮播的思路虽然各有不同,但是大的逻辑其实差不多,本文主要依据慕课网上焦点轮播图特效这节课,不过慕课网主要用原生JS写,而笔者则用Vue进行了重构,并且进行了一点修改。完成后的组件效果图如下:一、理清思路,理解需求和原理1. 要写一个什么样的轮播?在点击右侧箭头时,图片向左滑动到下一张;点击左侧箭头时,...转载 2018-03-23 15:53:05 · 32057 阅读 · 9 评论 -
前端面试渲染页面类
DOM 说起共 7384 字,读完需 10 分钟。本文为《破解前端面试(80% 应聘者不及格系列)》文章的第二篇,包含 DOM、Event、浏览器端优化、数据结构和算法功底的考察。可能有同学会问 DOM 有什么好聊的,不就是节点的各种操作么?DOM 是网页构建的基石,熟练掌握各种操作、知晓可能的问题、熟悉优化手段,才能做到在工程实践中从容不迫。系列文章链接:闭包篇。下面开始聊 DOM 的话题。如何...转载 2018-03-23 13:58:08 · 370 阅读 · 0 评论 -
柔滑流畅的JavaScript动画的秘密!
requestAnimationFrame柔滑流畅的JavaScript动画的秘密!用JavaScript创建动画是你可以做的最简单的事情之一。如果你曾经尝试过这样做,那么你很可能已经使用过setTimeout或者setInterval功能。这是一个典型的例子:函数 draw () { //绘图代码在这里} setInterval ( draw , 100 );这段代码会draw每1...转载 2018-03-23 13:51:52 · 511 阅读 · 0 评论 -
this指向
this、apply、call、bind这又是一个面试经典问题~/(ㄒoㄒ)/~~也是 ES5中众多坑中的一个,在 ES6 中可能会极大避免 this 产生的错误,但是为了一些老代码的维护,最好还是了解一下 this 的指向和 call、apply、bind 三者的区别。this 的指向在 ES5 中,其实 this 的指向,始终坚持一个原理:this 永远指向最后调用它的那个对象,来,跟着我朗读...转载 2018-03-23 11:05:34 · 245 阅读 · 0 评论 -
H5拖放
<!DOCTYPE HTML><html><head><script type="text/javascript">function allowDrop(ev){ev.preventDefault();}function drag(ev){ev.dataTransfer.setData("Text",ev.target.id);...原创 2018-03-15 13:18:11 · 216 阅读 · 0 评论