高级js学习
文章平均质量分 85
js一些比较神的用法学习
coderlin_
幸运=99%的努力+1%的运气
展开
-
函数式编程
函数式编程FPFP是编程范式之一,除此之外,还有面向过程编程,面向对象编程.面向对象编程的思维方式:把现实世界中的事物抽象成程序世界中的类和对象。通过封装,继承和多态来演示事务事件的联系。函数式编程的思维方式:把现实世界的事物和事物之间联系抽象倒程序世界,对运算过程进行抽象本质:根据输入通过某种计算获的相应的输出。x->f (联系,映射) =>y ,即 y=>f(x)函数式编程中的函数不是指程序中的函数或者方法,而是数据中的映射关系,如y=sin(x),x和y的关系。相同原创 2022-04-12 13:17:26 · 908 阅读 · 0 评论 -
高级js 8迭代器,通信
迭代器Iterator是一种机制,规范,为各种不同的数据结构提供统一的访问机制,任何数据结构只要部署了Iterator,就可以通过for of循环遍历。规范:1 拥有next方法用于依次遍历数据结构的成员。2 每一次遍历都返回统一的对象,done用来判断是否遍历结束,value为当前遍历的结果。根据这个规范实现自己Iterator类。class Iterator { constructor(assemble){ let self = this self原创 2022-01-19 20:00:47 · 702 阅读 · 0 评论 -
js 数据结构 树(二叉搜索树的实现)
二叉树重要的特性一个二叉树第i层的最大节点数为 2 ^ (i - 1), i>=1深度为k的二叉树有最大节点总数为: 2 ^ k -1 k>=1对于任何非空二叉树T,若n0表示叶节点的个数,n2是度为2的非叶节点个数,那么两者的关系是 n0 = n2 + 1完美二叉树除了最下面的叶子节点,其他节点的度均为2。完全二叉树,除了二叉树最后一层外,其他各层的节点数都达到最大个数。且组后一层从左向右的叶子节点连续存在,只缺若干节点,完美二叉树是特殊的完全二叉树这个并不是完原创 2021-12-09 13:07:12 · 932 阅读 · 0 评论 -
高级js学习7 prototype 继承 微任务宏任务以及promsie
prototype重定向function Fn(){}Fn.prototype.say = () => {}Fn.prototype = new Fn()重定向有几个问题1 重定向后prototype指向的对象可能不具备constructor对象,必须自己手动配置。2 可能导致浏览器默认开启的原型对象上的方法丢失。解决:重定向的对象最好和之前的原型对象做一个合并处理。如Fn.prototype = Object.assing({}, Fn.prototype, new Fn())原创 2021-12-07 18:39:06 · 586 阅读 · 0 评论 -
js eventloop
浏览器事件环为了实现js的异步概念。js是单线程的(主线层),内部是多线程的,比如setTimeout,ajax。进程:计算机分配任务的最小单位线程:进程里包含多个线程浏览器是由多个进程运行的,每个网页都是一个进程。浏览器也有一个主进程(用户界面),网络进程(处理请求),渲染进程,GPU进程(3d绘制),第三方插件的进程等等渲染进程(包含多个线程)GUI渲染线程(渲染页面)js引擎线程,和GUI线程互斥。(跟gui共用同个线程,只能通个时间开启一个,也叫”单线程“)事件触发线程,独立的原创 2021-11-28 23:19:37 · 493 阅读 · 0 评论 -
js 手撕Promise2 实现静态方法 手撕async await generator
实现静态方法Promise.resolveall finallyPromise.all方法接收一个p romise的iterable类型,并且只返回一个Promise实例。如果全都成功它们的值就作为then的第一个参数的入参,为数组[val1,val2,],但是如果传入的 promise 中有一个失败(rejected),Promise.all 异步地将失败的那个结果给失败状态的回调函数,而不管其它 promise 是否完成。实现:...原创 2021-11-28 21:58:00 · 307 阅读 · 1 评论 -
js 高阶函数 发布订阅观察者模式 手撕promise
promise高阶函数概念:1 一个函数返回一个函数。2 函数参数可以接受一个函数。满足任意两点即可。场景: 扩展方法function core(...args){ // 核心代码 console.log('core'); }要在core核心代码执行前后处理一些逻辑,但是不能修改Core的代码,怎么操作呢?function core(...args) { // 核心代码 console.log("core", ...args);}Funct原创 2021-11-27 18:14:37 · 2647 阅读 · 1 评论 -
高级js学习(6)面向对象阶段。
面向对象JS中常见的内置类。一般每一种数据类型都有自己的类。如Number,每个数字类型都是他的实例String,每个字符串都是他的实例。Boolean,BigInt,Object,Array,Set,Map,Date,Symbol,RegExp,Error,Event,Function元素对象,如HTMLDivElement等,HTMLDivElement是HTMLElement的实例,而HTMLElement又是Element的实例。Element是Node的实例。Node是EventT原创 2021-11-17 19:01:56 · 448 阅读 · 0 评论 -
js数据结构学习(2)双链表 集合
双链表单链表明显的缺点就是寻找上一个节点的时候太麻烦,需要从头遍历。双向链表既可以从头遍历到尾也可以从尾遍历到头,也可以解决单向链表的缺点。缺点:插入和删除的时候需要处理四个指针,比较复杂。比起单向链表,占用内存肯定稍微大一点。但是其与方便程度相比,是微不足道的。特点:有头指针和尾指针指向链表的第一个和最后一个节点每个节点有三部分,data,pre,next第一个节点的pre为null最后一个节点的next为null...原创 2021-11-16 08:01:16 · 450 阅读 · 0 评论 -
js 数据结构 字典 哈希表
字典字典的主要特点就是对应关系,使用键值对存储数据,并且无序。有些语言称这种映射关系为字典,有些称为Map。在java中,对象和字典区别较大,对象一般是编译期确定下来的结构,不可以动态增加,但是字典是基于哈希表的数据结构去实现的一种可以动态增删的结构。在早期js中,没有字典的说法,但是可以用对象去代替,es6后新增了Map的类型。目前我们基于js的object来实现字典,字典的实现与集合差不多,可以参考集合哈希表哈希表一般是通过数组实现的,但它相对数组有一些优点,我们知道数组添加的时候很耗原创 2021-11-12 09:59:51 · 1614 阅读 · 0 评论 -
js高级学习5 模块化编程 节流防抖 第一阶段总结
模块化编程最早起的模块化 高级单例设计模式解决变量命名限制1 IFFE 利用闭包的保存机制(function(){ let A = 1})()(function(){ let A = 'A'})()2 基于对象进行分组,每个对象都是Object的实例 ->单例设计模式let a = { A: 1}let b = { A: 'A'}基于单独的实例,实现信息的分组,可以避免污染。a和b可以称为是命名空间,把描述同一事物的属性和方法放在相同的命名空间中。使用闭包模拟原创 2021-11-03 19:14:00 · 134 阅读 · 1 评论 -
高级js4 闭包作用域面试题详解 this 闭包方案
严格模式下与非严格模式下的形参与arguments的映射var a = 4;function b (x,y,a){ console.log(a) // 3 arguments[2].= 10 console.log(a) //严格模式下是3,非严格模式下是10 }a = b (1,2,3)console.log(a) //undefined来看看区别,首先,不管严格或者非严格模式下,函数在执行的时候形成一个上下文,然后初始化作用域链,接着初始化arguments {0:1, 1:2,原创 2021-10-29 12:56:59 · 237 阅读 · 0 评论 -
js数据结构(1)栈 队列 单链表
认识数据结构数据结构是计算机存储、组织数据的方式。数据结构是指相互之间存在一种或多种特定关系的数据元素的集合。 --百度百科我们以自己的角度认识数据结构。数据结构是计算机存储、组织数据的方式,计算机中数据量非常庞大,如何以高效的方式组织和存储呢?举个简单的例子,有一个图书馆,如何排放书本才能使书本找起来非常方便,而且有新书本的时候也能快速的放入到准确的位置。解决问题的方法,跟书本(数据)的组织方式有关,以什么样的方式来存储和组织我们的数据才能在使用数据的时候更加方便呢?这就i是数据结构需要考虑的问题原创 2021-10-28 09:34:06 · 173 阅读 · 0 评论 -
高级js系列3 函数运行机制 this指向
其他类型转为字符串1 val.toString2 String(val)区别:String转为原始类型的时候,基于引号包起来,binInt回去掉n转化对象的时候,其解析顺序就是调用对象的Symbol.primitive、valueOf、如果valueOf返回的是原始值,就将其转化为string,如果不是原始值,则调用toString方法。toString的每个类型的原始链上的一个方法,用于转化为string类型。3 隐式转换 +号规则:1 两边有一边是字符串的时候,则会变为原创 2021-10-10 11:54:31 · 228 阅读 · 0 评论 -
高级js学习(2)数据类型
数据类型的一些细节1 numberJs的number包括整数,浮点数,正数,负数,0.NaN(not a number)他表示不是一个有效的数字,但是它隶属于number类型。如:NaN和任何值都不相等,包括自身。isNaN(val)用来检测val不是一个有效的数字。如果不是一个有效的数字则为true,否则为false。其次,如果val不是Number类型,会先隐式转换为number类型,再进行检测。如Object.is(a,b)是es6中提供的方法,不兼容ie浏览器,它可以正确的判断两个值是原创 2021-09-23 09:07:41 · 511 阅读 · 0 评论 -
JS 判断盒子滚动到底部
了解三个概念a.scrollTop ----> a盒子被卷上面的距离a.scrollHeight ----> a盒子的真正高度,包括被隐藏的a.offsetHeight —> a盒子的可视高度,那么,当被卷去的高度等于真正的高度-可视的高度时,也就是上图你看不到的隐藏的高度等于盒子被卷去的高度时,就到达了底部。故 if(a.scrollTop === a.scrollHeight - a.offsetHeight ){ console.log(‘到底部了’) }原创 2020-12-30 15:12:55 · 1121 阅读 · 1 评论 -
js学习(闭包本质,尾调用优化)
在看书时想做的一些笔记闭包本质闭包通俗讲就是一函数对外部函数有引用变量,导致外部函数运行完毕后还不能被销毁,因为其内部变量还在被引用。今天看书后发现有更深入的解释以一个例子入手如图,里面的匿名函数引用了外部函数create的变量propertyName,导致create函数在运行过后还不能被销毁。js高级程序设计是这样说的每个函数在调用的时候会产生一个执行上下文,如图上下文中有一条作用域链,该链的最前端是函数内部的活动对象,如create的arguments,propertyName变量原创 2021-07-28 11:09:01 · 305 阅读 · 0 评论 -
高级js学习(1)typeof检测机制+栈堆内存
1 数据类型ECMAScipt是基于对象的:在ECMAScript中,对象是0个或者多个属性的集合,每个属性具有决定每个属性的“属性”,当属性的可写属性被设置为false的时候,执行ECMAScirpt代码为其分配不同的值都将失败。属性是容纳其他对象,基本值或者函数的容器。原始值是以下内置类型之一的成员,undefined null boolean number string symbol。对象是内置类型对象的成员,函数是可调用对象,通过属性与对象关联的函数称为方法。原始类型number null原创 2021-09-17 08:51:17 · 346 阅读 · 0 评论 -
js一些数组对象方法原理实现(手撕map,filter,every,flat等)
Arraymapmap支持两个参数,一个回调函数,一个this,回调函数接受三个参数,值,索引,数组本身。思路即是利用this拿到数组本身,然后遍历反复调用传入的回调函数fn,将值,索引,数组本身传进去调用,一般返回一个值,直接push进一个空数组,最后返回即可。例子filter实现思路同map类似,只不过fn从返回一个值变成了返回一个布尔值,通过这个布尔值判断要不要将当前的值加入到数组,最后返回。例子...原创 2021-07-19 08:50:01 · 1311 阅读 · 1 评论