JavaScript
旺仔流奶
从现在开始努力也不算太晚
展开
-
红宝书第八章:对象、类和面向对象编程
属性的类型:js使用一些内部特性来描述属性的特征,但是不能直接访问。属性分两种:数据属性 和 访问器属性1.数据属性数据属性包含一个保存数据值的位置。数据属性有4个特性描述它的行为:[[Configurable]] 表示属性是否可以通过 delete 删除并重新定义,是否可以修改它的特性,以及是否可以把它改为访问器属性。 [[Enumerable]] 表示属性是否可以通过 for-in 循环返回。[[Writeable]] 表示属性的值是否可以被修改。 [[Value]..原创 2022-01-19 15:38:03 · 478 阅读 · 0 评论 -
【基础】节流和防抖的实现方式
节流函数节流:连续触发事件时 n秒内只能执行一次处理函数。两种实现模式:1.时间戳版 2.定时器版// 1. 时间戳版 function throttle(fn,interval){ let previous = 0; return function(){ let now = new Date(); if(now - previous > interval){ fn.apply(this,arguments); previous = n.原创 2022-01-07 15:30:55 · 793 阅读 · 0 评论 -
【基础】JS中new时都做了什么?
JS new一个新对象的时候都做了什么??创建一个新对象 obj 将这个新对象的__proto__指向构造函数的prototype 将构造函数里面的this指向这个对象obj 返回这个对象obj。注意:问:当函数自身有返回值,new时返回的是?答:如果函数自身返回值 是引用类型,那么返回的还是那个引用类型。如果函数自身返回值 是值类型,那么返回的会是新创建的对象 obj。实现:function _new(constructor, ...args) { v原创 2022-01-06 16:11:14 · 234 阅读 · 0 评论 -
【面试】js面试题
题目一:if (a == 1 & a == 2 && a == 3) {console.log('success!');}请问 a?知识点:因为== 会进行隐式类型转换,当a进行类型转换时改变值。let a = { _default: 0, toString: function () { return ++this._default ; }}if (a == 1 & a == 2 &...原创 2022-01-04 22:02:33 · 340 阅读 · 0 评论 -
【基础】重写foreach&map&filter&every&some&reduce&reduceRight
1. 重写foreachArray.prototype.myForeach = function(cb){ var _arr = this; var _arg2 = arguments[1] || window; var item; for(var i =0;i<_arr.length;i++){ item = deepCloneES5(_arr[i]); cb(_arr[i],i,_arg2); }}const ar原创 2021-12-29 14:17:50 · 465 阅读 · 0 评论 -
【基础】使用ES5和ES6实现 深拷贝
var obj = { name: '赵小咩', age: 25, info: { hobby: ['travel', 'eat', { a: 1 }], career: { student: 12, } }}// ES5 版本的深拷贝function deepCloneES5(origin, target) { var tar = target.原创 2021-12-28 22:48:30 · 477 阅读 · 0 评论 -
【基础】js中的相等性判断
JS中相等性判断ES6版本中,四种相等判断的算法:全等: === 等于: ==零值相等: -0 === +0 同值相等: -0 !== +0 NaN === NaNJS中提供有关相等判断的方法1.严格相等 === Strict Equality2.非严格(抽象/非约束)相等 == Loose (自由的,不守限制的)Equality3.Object.is(v1,v2) ES6 ,判断两个参数是否是同一个值=== 严格相等不进行隐式类型转换 - 类型相原创 2021-12-28 15:35:29 · 2200 阅读 · 0 评论 -
【进阶】搞懂Event Loop
概念:event loop : 是一个执行模型,在不同地方有不同实现,所以浏览器和nodejs基于不同技术实现了各自的event loop宏队列:taskssetTimeout setIntervalsetImmediate(node) requestAnimationFrame(浏览器)I/O UI rendering (浏览器)微队列:jobsprocess.nextTick(node) PromiseObject.observe MutationObserve原创 2021-12-22 17:21:46 · 583 阅读 · 0 评论 -
javascript 事件
1.事件流1.事件冒泡事件从最具体的元素开始触发,然后向上传播。2.事件捕获事件从最不具体的元素开始,向下走。实际上是为了在事件到达最终目标前拦截事件3.DOM事件流DOM规范规定事件流分为3个阶段:事件捕获,到达目标,事件冒泡。事件捕获最先发生,为提前拦截提供可能。然后实际目标接收到事件,最后一个阶段是冒泡。2.事件处理程序1.DOM0事件处理程序:onclick 之类的2.DOM2事件处理程序程序:addEventListene原创 2021-11-01 11:39:25 · 353 阅读 · 0 评论 -
DOM元素尺寸
1)偏移尺寸 :元素在屏幕上占用的所有视觉空间(包括内边距,滚动条,和边框【不包含外边距】offsetHeight offsetLeft offsetTop offsetWidth2)客户端尺寸:元素内容及其内边距所占用的空间。cilentWidth cilentHeight3) 滚动尺寸scrollHeight scrollLeft scrollTop scroolWidthscrollWidth和scrollHeight可以用来确定元素内容的实原创 2021-10-27 15:13:29 · 194 阅读 · 0 评论 -
DOM学习
1.节点层级任何HTML活XML文档都可以用DOM表示为一个由节点构成的层级结构。document是每个文档的根节点,根节点唯一的子节点是<html>元素,称为 文档元素。文档元素是文档最外层的元素,每个文档只能有一个文档元素。HTML页面中,文档元素始终是<html>元素。1.Node类型每个节点都有nodeType属性,表示该节点的类型。Node类型上定义的12个数值常量。1.nodeName 和 nodeValue这两个属性保存有原创 2021-10-21 19:20:33 · 103 阅读 · 0 评论 -
【基础】 js 数组遍历的6种方式
const arr = [1,2,3,4,5,6,7];1.for循环for(let i = 0; i < arr.length; i++){ console.log(arr[i])}2.for…offor(num of arr){ console.log(num)}3.forEacharr.forEach((item,index)=> { console.log(`${index}:${item}`);})4.mapconst re原创 2021-10-20 17:12:55 · 85 阅读 · 0 评论 -
二叉树的遍历
1.前序遍历先访问根节点,再访问左右孩子。function preOrder(node){ if(node == null) { return ; } console.log(node); preOrder(node.left); preOrder(node.right);}2.中序遍历先访问左孩子,再访问根节点,再访问右孩子function inOrder(node){ if(node == null) { return ; }原创 2021-10-14 19:21:39 · 49 阅读 · 0 评论 -
【js基础】call,apply的实现
// call 模拟// https://segmentfault.com/a/1190000009257663const obj = { name:'zy'}function callName(name1,name2){ console.log(this.name + ','+name1+','+name2);}// 第一版Function.prototype.myCall1 = function(context){ context.fn = this;原创 2021-03-12 00:10:41 · 59 阅读 · 0 评论 -
设计模式学习
1.观察者模式eg:DOM事件需要监听dom元素一些行为,但却不知道用户会在什么时间主动触发—— 在DOM节点上绑定事件函数var dom = document.getElementById('box');dom.addEventListener('click', function () { console.log("click box");}, false);// 模拟点击dom.click(); // click box此时,DOM的click事件是被观察者..原创 2021-03-11 17:59:18 · 46 阅读 · 0 评论 -
React Hook学习
1.作用在函数式组件中可以做到管理状态,和模仿生命周期函数等操作2.State HookuseState() :参数是初始值,返回的是当前state和更新state的函数(实际上组成一个数组)const [count , setCount] = useState( 0 );// 数组解构语法但是声明一个对象或者数组时,更新state变量的操作是替换它而不是...原创 2020-04-09 11:40:18 · 123 阅读 · 0 评论 -
js高阶——自定义Promise
/** * 自定义Promise */console.log ('引入成功')(function(window){ const PENDING = 'pending'; const RESOLVED = 'resolved'; const REJECTED = 'rejected'; class Promise{ /** ...原创 2020-03-15 15:19:38 · 365 阅读 · 0 评论 -
js高阶——Promise学习
实例对象:通过new函数产生的对象函数对象:将函数作为对象使用时,叫函数对象。function Fn(){ //构造函数}const fn = new Fn() // fn——实例对象console.log(Fn.protoype) // 通过.来访问函数Fn的属性,此时Fn是函数对象Fn.call({}) // Fn是函数对象,所有函数对象都有这个call()属性...原创 2020-03-14 17:25:16 · 447 阅读 · 0 评论