
javascript
zc自由飞~
这个作者很懒,什么都没留下…
展开
-
for...in 和for...of的区别
① for of 可以遍历数组里的每一项(for of 遍历数组的值);一般不建议for in 遍历数组(for in 是遍历循环数组的索引(键值))var arr = ['haha','heihei'];for(var item of arr){ console.log(item);}打印结果:'haha','heihei'----------------------------------var arr = ['haha','heihei'];for(var item in arr){原创 2022-03-10 10:14:49 · 363 阅读 · 0 评论 -
vue高德地图实现海量点分组(用icon图标替换海量点)动态循环出groupStyleMap集合
高德 vue 海量点 图标分组 动态原创 2021-12-01 15:41:57 · 1019 阅读 · 0 评论 -
js 数组转成转成对象格式
原本数据格式:let arr =[‘哈哈’, ‘嘿嘿’];let say = ['哈哈', '嘿嘿'];const arr = new Map();for (let i=0;i<time.length;i++) { arr.set(i,say[i]);}console.log(arr);//{0 => '哈哈', 1 => '嘿嘿'}this.mark = strMapToObj(arr);console.log(mark);//{0: '哈哈',1: '嘿嘿 }st原创 2021-10-25 16:31:37 · 356 阅读 · 0 评论 -
数组扁平化
Array.prototype.flat可以实现数组扁平化:let arr = [1,2,[3],[2,[45,6]]];arr.flat(3);//[1,2,3,2,45,6]ES5实现数组扁平化:function flatten (arr) { let result = []; for (let i = 0;i < arr.length; i++) { if(Array.isArray(arr[i])) { result = result.conca.原创 2021-05-06 16:38:33 · 88 阅读 · 0 评论 -
数组去重
ES5function unique (arr) { let result = arr.filter(function(item, index, array) { return array.indexof(item) === index; }) return result;}ES6let result = arr => [...new Set(arr)];原创 2021-05-06 15:01:43 · 86 阅读 · 0 评论 -
介绍几种继承方式
原型链继承function Animal () { this.color = ['red', 'yellow'];}Animal.prototype.getColor = function () { return this.color;}function Dog () {}Dog.prototype = new Animal();//原型链继承关键的一句let dog1 = new Dog();dog1.color.push('blue');let dog2 = n原创 2021-05-06 14:51:08 · 149 阅读 · 0 评论 -
深入理解一下Object.prototype.toString.call()判断js数据类型
先看个例子:上边例子关键点在于call方法重定向this指针的问题。先介绍一下基础:在 JavaScript 里使用 typeof 来判断数据类型,只能区分基本类型,即 “number”,”string”,”undefined”,”boolean”,”object”,“function”,“symbol” (ES6新增)七种。对于数组、null、对象来说,其关系错综复杂,使用 typeof 都会统一返回 “object” 字符串。要想区别对象、数组、函数单纯使用 typeof 是不行转载 2021-04-30 14:34:07 · 1688 阅读 · 0 评论 -
js生成96点时刻数组
96Time() { const m = ['00', '15', '30', '45']; const time = []; for (let i = 0; i < 24; i++) { if (i === 0 && j === 0) { continue; } const t = (i < 10 ? '0' + i : '' + i) + ':' + m[j]; time.push(t); } } time..原创 2021-03-26 19:24:04 · 667 阅读 · 0 评论 -
js递归合并对象
function isObject (obj) { return Object.prototype.toString.call(obj) === '[object Object]'}function isArray (arr) { return Array.isArray(arr)}function merge (target, ...arg) { return arg.reduce((acc, cur) => { return Object.keys(cur).redu.原创 2021-03-11 15:35:07 · 595 阅读 · 0 评论 -
promise的使用与实现
promise概念:Promise对象是一个构造函数,用来生成promise实例。Promise代表一个异步操作,有三种状态pending,resolved(异步操作成功由pending转为resolved)rejected(异步操作失败由pending转为rejected),一旦变成resolve 或 reject两种状态后不会再更改。resolve函数在异步操作成功后调用,将pending状态变为resolve,并将它的参数传递给回调函数;reject函数在异步操作失败时调用,将pendi.原创 2021-03-09 17:46:50 · 348 阅读 · 0 评论 -
js排序算法
12原创 2021-02-26 10:53:41 · 120 阅读 · 0 评论 -
settimeout promise async-await的区别
1.settimeoutconsole.log('scriptstart')setTimeout(()=>{console.log('setTimeout')});console.log('scriptend')//执行顺序scriptstart->scriptend->setTimeout2.Promisepromise本身是同步的立即执行函数,当在executor中执行resolve或者reject的时候是异步操作,会先执行then/c...原创 2021-02-25 10:56:58 · 435 阅读 · 0 评论 -
async await用法
async代表后面的函数中有异步操作(声明一个异步函数只需要在普通函数前面加一个关键字async),await表示等待一个异步方法执行完成。async函数返回的是一个Promise对象(如果返回值不是Promise对象,也返回一个Promise,只不过立即resolve)。因此async函数通过return返回值会成为then方法中回调函数的参数:async function funA() { return 'hello';}funA().then(value => { co原创 2021-02-25 10:53:30 · 430 阅读 · 0 评论 -
generator
generator:由function*定义,除了return 语句之前,还可以用yield返回多次。例如:斐波那契数列(1,2,2,3,5,8,13,21,34)普通函数:函数只能返回一次,必须返回一个Array。function fib(max) { var t,a=0,b=1,arr=[0,1]; while(arr.length < max) { [a,b] = [a, a+b]; arr.push(b); } return arr;}g原创 2021-02-25 10:33:09 · 90 阅读 · 0 评论 -
js类型转换
1.js的隐式转换:减号(-)除号(/)乘号(*)求余(%):一律都会转换成数值后计算:'11' - 2 = 9'12' / 2 = 6'12' % 2 = 0'12' * 2 = 242.加号(+):数字+字符串=字符串,运算顺序从左到右:1 + '12' = 112数字+对象,优先调用对象的valueOf->toString:(toString是把对象转成字符串;valueOf是把数据类型转换成原始类型,也就是说原来是什么类型,转换后还是什么类型,日期类型除外)原创 2021-02-24 21:16:26 · 222 阅读 · 0 评论 -
V8内存管理和垃圾回收机制
垃圾回收:将内存中不再使用的数据进行清理,释放出内存空间。V8将内存分成新生代空间和老生代空间。新生代内存空间:主要用来存放存活时间较短的对象。新生代内存中的垃圾回收主要通过Scavenge算法进行,具体实现时主要采用Cheney算法。Cheney将内存空间一分为二,每部分都叫Semispace,这两个Semispace一个处于使用,一个处于闲置。处于使用中的Semispace叫From,处于闲置中的Semispace叫做To。Scavenge GC算法: 当 from 空间被占满时,启动 GC原创 2021-02-24 17:43:11 · 238 阅读 · 0 评论 -
柯里化
柯里化:将使用多个参数的一个函数转换成一系列使用一个参数的函数的技术。柯里化用途:// 普通的add函数function add(x, y) { return x + y; } // Currying后 function curryingAdd(x) { return function (y) { return x + y; } }add(1, 2);// 3 curryingAdd(1)(2);// 3实际上就是把add函数的x,y两个原创 2021-02-24 17:27:16 · 155 阅读 · 0 评论 -
instanceof原理
instanceof作用:检测对象A是不是另一个对象B的实例。能在实例的原型对象链中找到该构造函数的prototype属性所指向的原型对象,就返回true。即://__proto__:代表原型对象链instance.[__proto__] === instance.constructor.prototype //true原理:查看B对象的prototype属性指向的原型对象是不是在A的原型链上,若存在返回true,否则返回false。解析原理:function Person (n原创 2021-02-24 16:22:54 · 206 阅读 · 0 评论 -
js判断数据类型
js万物皆对象,只用typeOf是无法判断类型的。基本类型(null):String(null);基本类型(string/number/boolean/undefined)+function:直接typeof即可;其他引用类型(Array/Date/RegExp Error):调用toString之后根据[object type]进行判断。解析Object.toString方法:每个对象都有toString方法,toString返回"[object type]",type指的是对象的类型原创 2021-02-24 11:23:02 · 127 阅读 · 0 评论 -
事件冒泡 事件捕获
捕获=>目标=>冒泡捕获是从外向内捕获;冒泡是从内向外冒泡;事件冒泡:从内到外,假如我要点击的是div,点击后会一层一层的往上。案例:<div class="classv"> 祖宗 <div class="actva">我是老爸 <div class="foo">我是孩子</div> </div></div><script type="text/javascript"&g原创 2021-02-24 11:15:01 · 206 阅读 · 0 评论 -
js对象的深拷贝和浅拷贝
明天写原创 2021-02-24 10:40:44 · 272 阅读 · 0 评论 -
如何判断两个json是否完全相等
1.简单方法:模糊对比:将两个json数据(JSON.stringify)转成字符串,进行对比。2.精确方法:递归第一步:先准备三个工具方法:用于判断是否是对象类型,是否是数组,获取对象长度function isObj(object) { return object && typeof(object) == 'object' && Object.prototype.toString.call(object).toLowerCase() == "[obj原创 2021-02-24 09:56:06 · 10236 阅读 · 1 评论 -
js数组常用方法
Array.map():将数组汇总每个元素调用一个提供的函数,结果作为一个新的数组返回,没有改变旧数组。let arr = [1,2,3,4,5];let newArr = arr.map(x => x*2)console.log(arr);//[1,2,3,4,5]console.log(newArr);//[2,4,6,8,10]Array.forEach():遍历数组,没有返回值。forEach对item进行修改时,如果item是原始类型的值,原数组没变化;item是引用类型的原创 2021-02-23 22:22:22 · 207 阅读 · 0 评论 -
封装继承
封装继承方法:function_extends(Child,Father){Child.__proto__=FatherfunctionTemp(){//constructor指向子类的构造函数this.constructor=Child}Temp.prototype=Father.prototype;Child.prototype=newTemp();/***1.会有两个私有属性...原创 2021-02-23 16:50:52 · 161 阅读 · 0 评论 -
var let 以及变量提升
js作用域有:全局作用域,函数作用域,没有块级作用域的概念,ES6中新增了块级作用域。块级作用域偶{},包括if语句和for语句里面的{}也属于块级作用域。1.ES5存在的问题:①全局变量在if或者for循环中声明的变量会变成群居变量for(var i=0;i<=5;i++){ console.log("hello");}console.log(i);//5内层变量可能会覆盖外层变量var a=1;function fn(){ console.log(a)原创 2021-02-23 16:49:19 · 267 阅读 · 0 评论 -
this以及call apply bind
this如何确定this,其实就是知道当前函数执行主体是谁,如果是对象来调用,this就是调用的对象。letzhangsan={name:'张三',getName(){console.log(this.name)}}zhangsan.getName();this是zhangsan如果没有对象调用,直接执行:letgetName=zhangsan.getName;getName()没有对象调用分两种情况:非严格模式下,主...原创 2021-02-23 16:00:45 · 128 阅读 · 0 评论 -
js数组去重
第一种:利用indexOf判断数组中的项是否存在于新数组中。indeOf本身就是检索字符串中是否有需要的值,没有就返回-1。var arr = [1,2,3,4,6,3,7,22,59,33,4];Array.prototype.unique = function () { var arr = []; for (let i = 0;i<this.length;i++) { if (arr.indexOf(this[i] === -1)) { arr.push(t原创 2021-02-23 15:12:54 · 74 阅读 · 0 评论 -
闭包
当面试官问到闭包时该如何回答?当面试官问到闭包的时候其实是想问:为什么其他非闭包的函数没有权限访问另一个函数的内部作用域?为什么闭包有这个权限?什么是函数作用域?应该这样回答:由于在js中,变量的作用域属于函数作用域,在函数执行后作用域会被清理掉,内存也会被回收,但是由于闭包是建立在一个函数内部的子函数,因为其可以访问上级作用域的原因,即使上级函数执行完,作用域也不会随之销毁,这时候子函数(也就是闭包),变拥有了访问上级作用域中的变量的权限,即使上级函数执行完之后作用域内的值也不会被销毁。什么是原创 2021-02-23 14:44:50 · 208 阅读 · 0 评论 -
new运算符的执行过程
示例:function Animal (name) { this.name = name;}var cat = new Animal('cat');var cat = new Animal('cat');是关键代码,js引擎在执行这句代码的时候,内部做了很多工作,用伪代码模拟一下其内部流程如下:new Animal('cat') = { var obj = {}; obj.__proto__ = Animal.prototype; var result = Animal.原创 2021-02-23 11:30:27 · 768 阅读 · 0 评论 -
原型链
原型链是由原型对象组成:每个对象都有__proto__属性,指向了创建该对象的构造函数的原型,__proto__将对象连接起来组成了原型链。是一个用来实现继承个共享属性的有限的对象链。属性查找机制:当查找对象的属性时,如果实例对象自身不存在该属性,则沿着原型链往上一级查找,找到时则输出,不存在时,则继续沿着原型链往上一级查找,直至最顶级的原型对象Object.prototype,如果还是没找到,则输出null。属性修改机制:只会修改实例对象本身的属性,如果不存在,则进行添加该属性,如果需要修改原型的原创 2021-02-23 11:13:21 · 125 阅读 · 0 评论 -
原型、原型对象、构造函数、实例
示例:function Person (name, age) { this.name = name; this.age = age;}var person1 = new Person('nick', 22);var person2 = new Person('hellon', 20);画出下图:解析:Person是构造函数,具有name,age,prototype属性,每个构造函数都有一个原型对象(prototype),Person的prototype属性指向该构造函数的..原创 2021-02-23 11:04:48 · 704 阅读 · 4 评论 -
作用域链
什么是作用域链?当声明一个函数时,局部作用域一级一级向上包起来,就是作用域链。可以说我们在执行上下文中访问到的父级甚至全局的变量,都是作用域链的功劳。作用域链理解为一组对象列表,包含父级和自身的变量对象,因此可通过作用域链访问到父级里的变量和函数。作用域链特性?当函数执行时,总是先从函数内部寻找局部变量。如果内部找不到(函数的局部作用域没有),则会想创建函数的作用域(声明函数的作用域)寻找,以此向上。var a = 1;function fn () { var a = 1原创 2021-02-23 09:47:10 · 146 阅读 · 0 评论 -
执行上下文
什么是执行上下文:当前javascript代码被解析和执行时所在的环境,javascript中运行任何的代码都是在执行上下文中运行。执行上下文类型:全局上下文:默认最基础执行上下文。不在任何函数中的代码都位于全局执行上下文中,全局上下文做了两件事:创建了一个全局对象,在浏览器中这个全局对象就是window对象;将this指向这个全局对象,一个程序中只有一个全局执行上下文。函数执行上下文:每次调用函数时,都会为该函数创建一个新的函数执行上下文。每个函数都拥有自己的函数执行上下文,只原创 2021-02-22 22:48:07 · 284 阅读 · 2 评论 -
作用域
什么是作用域?作用域是变量和函数的可访问范围。作用域是靠函数形成的,一个函数的变量是不能在函数外被访问到的。作用域特性声明提前:一个声明在函数体内都是可见的,函数优先于变量非匿名自执行函数,函数变量为只读状态,无法修改。let foo = function(){ console.log(1)};(function foo() { foo = 10;//由于foo在函数中只为可读,因此赋值无效 console.log(foo)})结果打印: ƒ foo() {原创 2021-02-22 21:00:41 · 133 阅读 · 0 评论