![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
javascript
WILLCSDNKK
这个作者很懒,什么都没留下…
展开
-
JS 继承
function Father(name) { // 实例属性 this.name = name // 实例方法 this.sayName = function() { console.log(this.name) } } // 原型属性 Father.prototype.age = 19 // 原型方法 Father.prototype.sayAge = function() { console.log(this.age) } 1.原型链继承 将父类的实例作为子类.原创 2021-08-09 20:40:42 · 91 阅读 · 0 评论 -
new 运算符原理
创建一个空对象 让空对象的 __proto__ (IE 没有该属性) 成员指向构造函数的 prototype 成员对象 使用 apply 调用构造函数,属性和方法被添加到 this 引用的对象中 如果构造函数中没有返回其他对象,那么返回 this,即创建的这个新对象;否则,返回构造函数返回的对象 function Dog(name,age){ this.name = name this.age = age ...原创 2021-08-09 20:33:34 · 96 阅读 · 0 评论 -
instanceof 原理
用来测试一个对象是否在其原型链中是否存在一个构造函数的 prototype 属性 function Person() {} function Foo() {} // 原型继承 Foo.prototype = new Person() const foo = new Foo() console.log(foo.__proto__ === Foo.prototype) // true console.log(foo instanceof Foo) // true console.log(Foo.pr.原创 2021-08-09 20:30:42 · 94 阅读 · 0 评论 -
浅拷贝与深拷贝区别与实现
实现浅拷贝 浅拷贝中,浅拷贝只是拷贝了它在栈中存储的指针,它们指向的都是同一个堆内存地址,所以浅拷贝在某些情况会造成改变数据后导致别的另一份数据也同步被改变的情况; 1.for...in... 手动实现浅拷贝只需for...in...循环把oldobj里元素值遍历赋值给进新对象; 2.object.assign() 深拷贝的实现 深拷贝是直接将堆内存中存储的数据直接复制一份,不会有浅拷贝互相影响的问题。 1.递归实现 手动实现深拷贝只需封装一个函数,做一个是否为对象或.原创 2021-04-24 16:38:51 · 173 阅读 · 0 评论 -
JS的异步处理方案
1.回调地狱 const fs = require('fs'); fs.readFile('./1.txt','utf8',(err,result1) => { console.log(result1) fs.readFile('./2.txt','utf8',(err,result2) => { console.log(result2) fs.readFile('./3.txt','utf8',(err,result3) => { console.log(resul原创 2021-04-28 00:40:18 · 331 阅读 · 1 评论 -
内容水平垂直居中的几种方法
1.margin:auto法 原理:如果设置了绝对定位并且上下左右全部为0(不能只设置上左或者其他的任意两方向),那么他会填充整个父元素的所有可用空间,那么auto就有了作用,会平均分配剩余的空间 2.margin负值法 使用margin-top,margin-left,值各为width和height的一半。或者将transform:translate(-50%,-50%)实现 3.table-cell 4.利用flex 将父元素设置为display...原创 2021-05-11 22:28:00 · 370 阅读 · 0 评论 -
实现防抖节流
防抖动和节流本质是不一样的。防抖动是将多次执行变为最后一次执行,节流是将多次执行变成每隔一段时间执行。 防抖:触发高频事件后n秒内函数只会执行一次,如果n秒内高频事件再次被触发,则重新计算时间 解决方法:每次触发事件 时都取消之前的延时调用方法 <body> <input type="text" name="" id="in"> <script type="text/javascript"> function debounce(delay,cb){原创 2021-07-26 16:24:03 · 182 阅读 · 0 评论 -
数组扁平化处理
数组扁平化概念 数组扁平化是指将一个多维数组变为一维数组 以下例子统一vararr=[1,[2,3,[4,5,6]],7] 1.flat(Infinity) console.log(arr.flat(Infinity)) //(7)[1, 2, 3, 4, 5, 6, 7] 2.正则表达式 const arr2 = JSON.parse('[' + JSON.stringify(arr).replace(/\[|\]/g,'') + ']') console.log(ar...原创 2021-07-28 13:15:29 · 74 阅读 · 0 评论 -
圣杯布局以及双飞翼布局
圣杯布局以及双飞翼布局都是三栏布局的实现方式之一,只是实现方式不同而已 1.圣杯布局 1.将三者都 float:left , 再加上一个position:relative (因为相对定位后面会用到) 2.middle部分 width:100%占满 3.此时middle占满了,所以要把left拉到最左边,使用margin-left:-100% 4.这时left拉回来了,但会覆盖middle内容的左端,要把middle内容拉出来,所以在外围box加上 padding:0 200px 0 20原创 2021-08-01 17:13:04 · 252 阅读 · 0 评论 -
call,apply,bind三者区别
apply,call,bind三者的区别 var a = { name:'a', fn(){ console.log(`我的名字是${this.name}`) } } var b = a.fn b()//我的名字是undefined 如果只是a.fn();可以正常打印结果(我的名字是a);而此时var b = a.fn,此时调用函数的是在window环境下的b,但window下没有属性...原创 2021-08-04 18:31:16 · 77 阅读 · 0 评论 -
JS的数据类型以及如何检测数据类型
JS数据类型: 1.基本数据类型:Undefined,Number,String,Boolean,Null,Symbol(es6),Bigint(es10) 2.引用数据类型 Array,Function,Object 数据类型检测方法 1.typeof typeof 1 "number" typeof 'abc' "string" typeof true "boolean" typeof {} "object" ty原创 2021-08-04 21:28:48 · 113 阅读 · 0 评论 -
常用数组Array的API
目录 1.创建数组 Array.from Array.of() 2.模拟栈方法(push,pop) 3.模拟队列方法(push,shift)(unshift,pop) 4.排序方法sortreverse 5.操作方法concatslicesplice 6.搜索和位置方法indexOflastIndexOfincludesfind 7.迭代方法everyfilterforEachmapsome 8.归并方法reduce ...原创 2021-08-06 19:19:33 · 556 阅读 · 0 评论 -
一文解决原型与原型链
1.原型对象 什么是原型对象呢?有以下几点: 1.构造函数有一个prototype属性,指向构造函数的原型对象。而实例有一个__proto__属性,也指向原型对象。 PS: 准确的说,实例指向原型对象的是[[Prototype]]属性,但这是一个隐式属性,脚本不可访问。因此浏览器厂商提供了一个属性__proto__,用来显式指向原型对象,但它并不是ECMA规范。如下图一所示 注意函数的是prototype属性,实例的是__proto__属性 function Person(name...原创 2021-08-09 14:28:41 · 115 阅读 · 0 评论