![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
javascript
kangkang_style
活着的感觉挺好,珍惜来之不易的每一天
展开
-
JS 序列化 与 反序列化
序列化 定义: 序列化是把对象转换成有序字节流,以便在网络上传输或者保存在本地文件中。 序列化机制的核心作用就是对象状态的保存与重建。 本质上讲,序列化就是把实体对象状态按照一定的格式写入到有序字节流方法: obj => 对象 str => 字符串 arr => 数组 1. JSON.stringify(obj); 2. for (key in obj) { arr.push(key + ...原创 2021-02-01 15:12:58 · 2448 阅读 · 1 评论 -
XMLHttpRequest
定义: XHR对象用于与服务器交互。 可以在不刷新页面的情况下请求特定 URL,获取数据。 可以用于获取任何类型的数据,而不仅仅是 XML。 支持 HTTP 以外的协议(包括 file:// 和 FTP)。主要函数: 1. open 语法: xhrReq.open(method, url); xhrReq.open(method, url, async); xhrReq....原创 2021-01-27 17:44:36 · 176 阅读 · 0 评论 -
es6 类的导出、引入以及继承
导出的关键字 : export + 类名 举例: export class Name {...} 导入的关键字: import { 类名或模块名称 } from 文件相对地址 举例: import { Name, Location } from './userinfo'; 对于导入模块名称重复的处理: 重命名: import { 类名 as 新类名 } from 文件相对地址 举例: import { Name } from './userInfo'; impor.原创 2020-06-05 11:13:09 · 2473 阅读 · 0 评论 -
JS 添加有效身份证验证
/** * certificate 身份证识别 */export function IdentifyCertificate(cardNo) { let idCard = cardNo.toString(); let province = { 11: "北京", 12: "天津", 13: "河北", 14: "山西", 15: "内蒙古", 21: "辽宁", 22: "吉林", 23: "黑龙江", 31: "上海",.原创 2020-05-09 17:25:05 · 260 阅读 · 0 评论 -
module.exports、exports、export default、export、require、import 区别和不同之处
在es5中,用 module.exports 和 exports 导出模块,用 require 导入模块。在es6中,新增 export default 和 export 导出模块,用 import 导入模块。如果开发环境支持es6语法,用es5的 module.exports 和 exports 导出的模块,可以使用es6的 import 导入;用es6的 export default 和...原创 2020-04-20 17:51:04 · 250 阅读 · 0 评论 -
JS dateObject.getTime is not a function
dateObject.getTime is not a function这个错误出现的原因是通过接口或者初始化数据的时候获取的数据由date变为了string程序校验string类型数据没有getTime方法,所以检验出错。最简单的方法就是,通过string to date 还原数据类型 new Date('2019-11-11 09:41:13')或者通过取出校验的rule,一般是因为校...原创 2019-12-11 10:17:45 · 1143 阅读 · 0 评论 -
js 数组与对象的解构赋值
解构赋值是javascript 语法,作用是将值从数组、或属性从对象,提取到不同的变量中。1. 数组解构 1.1 声明变量并赋值: let hi = ['hello', 'world']; let [hello, world] = hi console.log(hello) => hello console.log(world) => world ...原创 2019-11-27 16:12:46 · 990 阅读 · 0 评论 -
JS 对象属性定义、检测与枚举
在JavaScript中,对象的属性分为可枚举和不可枚举之分,它们是由属性的enumerable值决定的。 可枚举性决定了这个属性能否被for…in查找遍历到。 判断对象是否可枚举: Object 对象的 propertyIsEnumerable() 方法可以判断此对象是否包含某个属性,并且这个属性是否可枚举。 1. 如果判断的属性...原创 2019-04-08 21:15:14 · 811 阅读 · 0 评论 -
es6 Async / Await
async/awaitf这种特殊的语法可以更舒适地与promise协同工作。async-await是promise和generator的语法糖。async-await 是建立在 promise机制之上的,并不能取代其地位。Async的使用:使用方法: 放置在函数的前面:async function demoFun () { return 1 } 含义: 这个函...原创 2019-01-10 17:38:34 · 563 阅读 · 0 评论 -
ES6 Promise
个人的第一感觉:Promise可以将异步函数中的执行结果回传到主线程上实际上Promise的作用就是把原来的回调写法分离出来,在异步操作执行完后,用链式调用的方式执行回调函数。Promise的构造函数接收一个作为参数的函数,这个函数传入了两个参数:resolve,reject,分别表示异步操作执行成功后的回调函数和异步操作执行失败后的回调函数。resolve是将Promise的状态置为fu...原创 2018-12-27 21:49:43 · 104 阅读 · 0 评论 -
es6 展开运算符
展开运算符与对象展开运算符展开运算符(spread operator)允许一个表达式在某处展开。展开运算符在多个参数(用于函数调用)或多个元素(用于数组字面量)或者多个变量(用于解构赋值)的地方可以使用。展开运算符不能用在对象当中,因为目前展开运算符只能在可遍历对象(iterables)可用。iterables的实现是依靠[Symbol.iterator]函数,而目前只有Array,Se...原创 2018-12-20 12:35:27 · 767 阅读 · 0 评论 -
js 实现继承
1. 对象冒充 实例: var Parent = function (username) { this.username = username this.getUserName = function () { console.log('usern...原创 2019-05-14 17:44:56 · 61 阅读 · 0 评论 -
JS对象的引用复制和数据复制
JS对象分为两类,一类为基础类型对象,包括字符串(String),数值(Number),布尔值(Boolean),null(空),undefined(未定义)。另一类为合成对象,又叫做引用类型对象,包括数组(Array),对象(Object),函数(Function)。基础类型对象存储的是对象的实际数据,引用类型对象存储的是对象的引用地址,而把对象的实际内容单独存放,因为引用对象通常比较庞大,...原创 2019-09-21 23:49:17 · 909 阅读 · 0 评论 -
获取当前页面url的各类参数
Location 对象 Location 对象包含有关当前 URL 的信息 Location 对象是 Window 对象的一个部分,可通过 window.location 属性来访问 Location的各种属性: window.location.hash => 设置或返回从井号 (#) 开始的 URL(锚) window.location.host => 设置或返回主机...原创 2019-09-24 23:03:51 · 764 阅读 · 0 评论 -
JS Object.assign()方法
作用: 用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。 实例: const one = {a: 1, b: 2} const two = {c: '3', d: '4'} var three = Object.assign({e: 5}, one, two) 打印结果:...原创 2019-04-08 21:13:33 · 7372 阅读 · 0 评论 -
Velocity.js 动画框架
网页的交互动效大概分为 css动画,js动画Animate.css属于css动画框架,Velocity.js属于js动画框架css动画的优点: 不用进行计算和更改dom 会显得非常流畅。js动画的优点: 没有css那样的局限性,可以实现更多的功能和动效安装: npm install velocity-animate使用方法: dom.velocity(...原创 2019-03-26 17:50:15 · 2075 阅读 · 0 评论 -
ES6中的const、let、var以及作用域的定义
1. const 和 let 必须先声明再使用,不支持变量提升console(a) // 报错console(b) // 报错let a = 1const b = 22. const必须先声明,且赋予初始值才能使用,否则报错const aconst b = 1console.log(a) // 报错console.log(b) // 正确3. let必须先声明,但不...原创 2018-05-16 18:04:37 · 252 阅读 · 0 评论 -
给iframe添加点击事件
方案一:无本地源码iframe存在跨域问题,所以需要用到document.activeElement1.0处理方法:export const IframeOnClick = { resolution: 200, iframes: [], interval: null, Iframe: function () { this.element = arguments...原创 2018-09-05 15:48:06 · 11465 阅读 · 3 评论 -
存储、读取、清除cookies数据
// 存cookies setCookies (key, value, execTime) { var exdate = new Date() // cookies保存天数 exdate.setTime(exdate.getTime() + 24*60*60*1000*execTime) // 拼接 window.documen...原创 2018-11-13 16:13:39 · 797 阅读 · 0 评论 -
DataURL与File,Blob,Canvas之间的互相转换
DataURL: 数据格式的url,src可以直接指向dataURL用来显示图片。 图片被转换成base64编码的字符串形式,并存储在URL中,冠以mime-type。 Bolb: 是一种javascript对象类型,可以存储大量二进制数据 HTML5的文件操作对象,file对象就是Blob的一个分支或说一个子集。1.Canvas 转换为 DataU...原创 2018-12-26 17:53:32 · 1253 阅读 · 0 评论 -
同步、异步、阻塞、非阻塞、回调函数
同步:执行一个操作之后,等待结果,然后才继续执行后续的操作。异步:执行一个操作后,可以去执行其他的操作,然后等待通知再回来执行刚才没执行完的操作。阻塞:进程给CPU传达一个任务之后,一直等待CPU处理完成,然后才执行后面的操作。非阻塞:非阻塞就是将阻塞的等候时间区块细分成若干个小的阻塞时间块,在若干个阻塞之间,CPU有机会处理其他进程的任务。进程给CPU传达任务后,继续处理后续的操...原创 2018-12-27 20:42:16 · 849 阅读 · 0 评论 -
js map()定义与用法
基本用法跟forEach方法类似 map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。 map() 方法按照原始数组元素顺序依次处理元素。 注意: map() 不会对空数组进行检测。 注意: map()返回的是新数组,map() 不会改变原始数组。 语法: array.map(function(cur...原创 2019-01-22 11:16:00 · 23980 阅读 · 0 评论 -
es6 find()和findIndex()查找函数
1. find() 用来查找目标元素,找到就返回该元素,找不到返回undefined. 查找回调函数,有三个参数 语法: array.find((value, index, arr) => {value === '匹配对象'}) 2. findIndex() 用来查找目标元素,找到就返回元素的位置,找不到就返回-1。 查找回...原创 2019-04-03 21:03:52 · 1810 阅读 · 0 评论 -
es6 filter()过滤函数
1. filter() 返回符合条件的元素的数组[] 筛选回调函数,有三个参数 语法: array.filter((value, index, arr) => {value === '匹配对象'})特殊用法: 1. 去掉空字符串、undefined、null array.filter((value, index, arr) => {value}) 2. 数组去重...原创 2019-04-03 21:05:01 · 5013 阅读 · 0 评论 -
js区分for,for in,for of,forEach的使用场景
for 循环结构: for (初始化表达式1; 判断表达式2; 自增表达式3) { // 循环体4 }实例: for (let i = 0; i < 5; i++) { // 循环体逻辑 console.log(i) }for in索引遍历,主要用于循环/迭代对象属性,可以用来循环/迭代数组对象迭代出来的是对象的属性key值,可以通过o...原创 2019-04-03 21:06:10 · 276 阅读 · 0 评论 -
js some() 与 every() 函数
声明实例数组: const arr = [1,2,3,4]1. every() 一假即假 是对数组中每一项运行给定函数,如果该函数对每一项返回true,则返回true。 实例: let result = arr.every((val, index, arr) => {val > 2}) // result => false 2. some() 一真即真...原创 2019-04-03 21:07:12 · 552 阅读 · 0 评论 -
js decodeURI、decodeURIComponent、encodeURI、encodeURIComponent
作用: 用来编码和解码URI区别: 1. encodeURI 和 decodeURI 函数操作的是完整的 URI; 这俩函数假定 URI 中的任何保留字符都有特殊意义,所有不会编码它们。 2. encodeURIComponent 和 decodeURIComponent 函数操作的是组成 URI 的个别组件; 这俩函数假定任何保留字符都代表普通文本,所以必须编码它们,所以它们(...原创 2019-04-03 21:08:23 · 121 阅读 · 0 评论 -
es6 set 与 WeakSet
set: ES6提供的新的数据结构Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。 Set函数可以接受一个数组(或类似数组的对象)作为参数,用来初始化。 在Set内部,两个NaN是相等。两个对象总是不相等的。可以用length来检测。 set的四个操作方法: add(value): 添加某个值,返回Set结构本身。 delete(value): 删除...原创 2019-04-03 21:09:27 · 204 阅读 · 0 评论 -
es6 模板字符串
模板字符串语法: es5写法: 需要使用大量的“”(双引号)和 + 来拼接才能得到我们需要的模版 实例: "He is <b>" + person.name + "</b> and we wish to know his" + person.age + ".That is all" es6写法: 用`(反引号)标识,用${}将变量括起来...原创 2019-04-03 21:10:37 · 552 阅读 · 0 评论 -
Sortable.js 拖放排序插件
Sortable.js是一款轻量级的拖放排序列表的js插件1. 安装 $ npm install sortablejs --save2. 使用 定位到需要排序的对象,创建Sortable对象并添加响应配置设置 可以通过方法: var sortable = Sortable.create(el,{}) 或者 var sortable = new Sortable(el,...原创 2019-03-26 17:45:08 · 1576 阅读 · 3 评论 -
js body 设置onmousedown事件响应
为什么在body中设置onmousedown事件响应无效:原因有几下几点:1.浏览器的原因,firefox针对body的onmousedown没有设置该事件的响应机制2.body没有撑开,即没有点击到事件的触发对象上可以将html,body,撑开,并设置背景辅助调试原创 2017-07-16 13:02:58 · 2854 阅读 · 0 评论