
web高级js
Hei,candy
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
js数组方法的对比记忆
整理以下数组相关的方法,有对比就比较好记忆。项目是否改变原数组项目返回值参数map否新数组函数forEach否undefined函数find否找到就返回找到的值,否则返回undefined函数findIndex否找到就返回找到的值的index,否则返回-1函数indexOf否找到就返回找到的值的index,否则返回-1要查找的元素includes否找到返回true,否则返回false需要查找的元素pop是从原创 2021-10-05 20:02:28 · 149 阅读 · 0 评论 -
一道面向对象的面试题的好几种解法
var a = ?;if (a == 1 && a == 2 && a == 3) { console.log('OK');}第一种思路 利用转换数字第二种思路 利用数据劫持–object.defineProperty(or proxy)原创 2021-03-07 20:33:10 · 128 阅读 · 0 评论 -
怎么让类数组(鸭子数组)也能使用数组的方法
粗糙答案在此,有空再来慢慢改原创 2021-03-07 19:27:34 · 154 阅读 · 0 评论 -
函数的防抖与节流(全网最全最细致)
定义防抖:多次点击,只识别一次。假设我设定500ms内重复点击无数次都只算做一次。节流:多次点击,只按照规定的的时间间隔来执行。比如,我设定每100ms执行一次,那么在500ms的设定时间内,无论点击多少次,都只识别并且执行5次。防抖debouncefunction debounce(func, wait, immediate) { // 多个参数及传递默认的处理 if (typeof func !== "function") throw new TypeError("func mu原创 2020-11-11 10:27:05 · 247 阅读 · 0 评论 -
闭包作用域的变态机制之es6形参赋值默认值导致的问题
//题目1var x = 1;function func(x, y = function anonymous1(){x = 2}){ x = 3; //私有x=3 y(); console.log(x); //=>2}func(5);console.log(x); //=>1//题目2var x = 1;function func(x, y = function anonymous1(){x = 2}){ var x = 3; y();原创 2020-12-14 16:24:01 · 139 阅读 · 0 评论 -
js中数组求和的几种方法与重写reduce
在js面试中数组求和是很常见的面试题,接下来的文章分为两个部分,第一部分写常见的数组求和方法,第二部分写reduce的用法以及重写reduce。常见的数组求和方法原创 2020-12-14 10:54:59 · 1530 阅读 · 0 评论 -
因为浏览器版本问题导致的闭包作用域的变态机制
{ function foo() {} foo = 1;}console.log(foo);----{ function foo() {} foo = 1; function foo() {}}console.log(foo);----{ function foo() {} foo = 1; function foo() {} foo = 2;}console.log(foo);原创 2020-12-03 19:26:39 · 143 阅读 · 0 评论 -
重写call与bind(具体细节可以看this情况那一篇)
重写内置的call的关键是把要执行的函数和和需要改变的THIS关联在一起也就是给Function.prototype.call重新写一个函数。Function.prototype.call = function call(context, ...params) { // this->fn context->obj params->[10,20] context == null ? context = window : null; // 需要保证context原创 2020-12-01 16:26:12 · 113 阅读 · 0 评论 -
js中的几种继承方式(有意思的)
js的继承与其他语言不大一样,继承的目的是让子类的实例同时具备父类实例私有的属性和公有的方法。1.原型继承what:子类的原型等于父类的一个实例特点:父类中私有和公有的属性和方法最后都变成子类实例公有的。和其他语言不同的是:原型继承不会把父类的属性方法“”拷贝”给子类,而是指向型的,即让子类的__proto__基于原型链查找到自己定义的属性和方法。如果这样修改 children.proto=xxx,能实现子类改写原有父类一个实例的内容,对子类的其他实例有影响,但是对父类没有影响,ie678不允许使用原创 2020-11-30 22:29:52 · 227 阅读 · 0 评论 -
this有意思的应用(数组求和and任意数求和)
获取数组中的最大值 let arr = [10, 13, 24, 15, 26, 34, 11];//方法1arr.sort((a, b) => b - a);console.log(`数组中的最大值是:${arr[0]}`) //方法2console.log(Math.max(arr)); //NaN Math是对象的方法,数组没法直接用console.log(Math.max(10, 13, 24, 15, 26, 34, 11)); //34console.log(Math.ma原创 2020-11-27 15:47:33 · 136 阅读 · 0 评论 -
this的情况(函数和对象中的this指向谁)
this是什么首先 this:函数的执行主体,也就是谁去执行这个函数。和作用域是两个不同的概念。作用域scope是函数执行的上下文。举个例子:我去米其林三星吃饭。我去吃饭,吃饭的人是我(函数的执行主体),去哪里吃饭?米其林三星(函数作用域),这就是函数作用域和函数执行主体的区别,这两个概念一定不能混淆。函数执行主体this,有以下几种情况:1.事件绑定2.普通函数执行3.构造函数执行4.箭头函数执行5.基于call/apply/bind强行改变this现在逐一讨论这几种情况。1.事件绑定原创 2020-11-27 09:34:12 · 1251 阅读 · 0 评论 -
js中必须掌握的八种设计模式
1.什么是设计模式设计模式就是一种思想,用来规范编程的代码的,让代码 更整洁 清晰 维护 扩展等等。*2.单例设计模式和命令模式是早期的模块化编程,历史:AMD(require.js)CMD(sea.js)/common.js(node)ES6 module用于业务逻辑处理思想:基于单独的实例,来管理一个模块的内容,实现模块之间的独立划分,以及模块之间方法的相互调用。单例模式就是暴露方法,命令模式是控制这些方法谁先执行,谁后执行...原创 2020-11-26 10:25:57 · 365 阅读 · 0 评论 -
面向对象(OOP)之 函数的多种角色
函数有两大角色:函数和对象。其中函数既可以作为普通函数(有作用域链)的执行和又可以作为构造函数(原型和原型链)的执行。作为对象,有键值对。三种角色之间没有必然联系,可能存在间接关系。...原创 2020-11-19 16:30:09 · 178 阅读 · 0 评论 -
面向对象(OOP)之原型对象和原型链(js面向对象的底层处理机制)
首先记住三句话1.每一个类(函数)都具备prototype,并且属性值是一个对象2.prototype上有内置的属性constructor,值是类(函数)本身3.每一个对象都具备__proto__,属性值是当前所属类的prototype类和构造函数是一个概念接下来,详细讲解一下这三句话js面向对象的底层处理机制1 每一个函数数据类型都自带一个属性prototype(原型对象),属性值是一个对象,并且prototype中自带一个属性constructor,属性值是当前函数本身。此处有例外:箭头原创 2020-11-19 15:29:26 · 271 阅读 · 0 评论 -
面向对象之重写内置new——阿里面试题以及ES6展开运算符的小知识
怎么不用new得到一个新的实例?下面看一下两个代码的对比这两块代码可以实现同样的功能,但是一个是重写了内置的new。下面来详细说说怎么重写的,首先要了解new的运算机制,就是new到底做了什么。1.创建一个实例对象2.把执行函数的this指向实例对象(改变this指向)3.处理返回值。其中有个小知识点,关于ES6里面的展开运算符。function fn() {}let arr = [20, 30, 300]fn(...arr) //fn(20,30,300)fn(arr) //fn(原创 2020-11-18 20:01:35 · 152 阅读 · 0 评论 -
面向对象编程(OOP)中内置类原型方法扩展
向内置类原型上拓展方法内置类原型上提供了很多方法,但是这些方法不一定能满足日常业务需求,此时需要我们自己在内置类原型上拓展方法优点:1.调用起来方便2.可以链式调用,不用嵌套。3.限定了调取方法的类型,必须是指定类的实例。4.拓展的方法,小组其他成员都能用,相当于公共方法了。缺点:1.自己写的内置类的方法容易覆盖内置的方法,解决办法是在自己拓展的方法前面加my,比如mypop.同时Array.prototype={}是无效的,也怕自己会一行代码把所有的方法搞丢。2.基于for…in遍历的时原创 2020-11-18 15:35:23 · 136 阅读 · 0 评论 -
面向对象(oop)的易混知识点
首先是函数两种写法的不同之处。其次是成员访问中的this指向,这个地方比较细节,可以理解为this前面的一坨是一体。原创 2020-11-18 14:34:32 · 98 阅读 · 0 评论 -
Object.assign()必会易混点以及原型重定向中使用Object.assign()
Object.assign()知识点先看一个案例,当比较两个对象的时候,是用第二个obj2 去替换obj1 的内容当比较三个对象的时候,输出的是{}里面的内容Object.assign()浅比较let obj1 = { x: 100, y: 300, n: { name: 'Lily', gender: 'female' }}let obj2 = { z: 800, y: 600, n: {原创 2020-11-18 10:35:00 · 271 阅读 · 0 评论 -
面向对象(oop)的一些基础知识(二)之检测属性是否为当前对象的成员
Fn和Fn()的区别当new 执行的时候,如果不传递实参,那么可以写成new Fn,也就是不加小括号,这被称为无参数列表。相反的,如果是new Fn()被称为带参数列表。两者在优先级上也有区别https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Operator_Precedence同时再强调一下,每一次new都是把函数重新执行,重新形成一个新的上下文,重新创造一个新的实例对象,代码重新执行。检测属原创 2020-11-12 16:28:09 · 119 阅读 · 0 评论 -
面向对象编程(OOP)的非常基础的知识(一)
什么是面向对象编程两种编程思想:面向对象编程(oop)/面向过程编程(pop)c语言是pop的编程语言,其他大部分编程语言是oop,比如Python、Java、c++、php。而html和css不属于编程语言,它们是标记语言。拓展:less/sass/stylus是css的预编译语言,它们让css具备oop的特点,即代码无法被浏览器直接识别,必须经过编译(成为正常的css)才能在浏览器中渲染。有三个关键词是了解oop必须掌握的:1.对象:泛指,万物皆对象,JS里面我们所有学习研究和开发的都是对象原创 2020-11-11 16:50:56 · 983 阅读 · 0 评论 -
全网最全JS数据类型检测方法及底层机制
四种检测数据类型的方法1.typeof2.instanceof3.constructor4.Object.prototype.toString.call([value])这四种方法各自有优缺点,其中Object.prototype.toString.call([value])是最为强大的,接下来详细说说这四种方法的利弊和适用情况。typeof...原创 2020-11-11 16:43:09 · 205 阅读 · 0 评论 -
堆和栈的一些重要细节(包括typeof的一些缺点)
day1堆和栈数据类型数据类型分为基本数据类型和引用数据类型,其中基本数据类型又被称为 值类型or 原始类型基本数据类型有7种(包括ES6部分):Boolean,Number,String,Null,Undefined,symbol,bigint,其中symbol和bigint是ES6新增加的。引用数据类型有2种:object,function。其中object包括普通对象,数组对象,正则对象,JSON对象,map对象,set。易混点:数据格式是在现有数据类型上所呈现的不同格式。#检测数据类型原创 2020-09-29 16:32:21 · 730 阅读 · 0 评论