前端值得一探究竟特辑
那等雨停吧
愿你有梦可依,有树可栖。
展开
-
前端值得一探究竟特辑 --- Class及面向对象
ES5面向对象 使用传统的构造函数。通过call和apply将父类的constructor赋值到子类上,再对父类的原型进行遍历赋值到子类原型上。 function Person(name){ this.name = name; } Person.prototype.showName = function(){ console.log(this.name); } Person.pro...原创 2020-02-10 17:23:38 · 519 阅读 · 0 评论 -
前端值得一探究竟特辑 --- 原型和原型链
【函数】:普通函数,类(所有的类:内置类,自己创建的类) 【对象】:普通对象,数组,正则,arguments…实例是对象类型的(除了基本类型的字面量创建的值),prototype的值也是对象类型的,函数也是对象类型的。 原型和原型链讲解: 原型:一种管理机制 所有的函数都有一个prototype属性(这也叫显式原型,它也是一个普通的对象),浏览器默认为它开启一个堆内存。 浏览器默认为它开启一个的...原创 2020-02-06 20:19:23 · 370 阅读 · 0 评论 -
前端值得一探究竟特辑 ---普通函数运行与构造函数运行(new背后的故事)
普通函数执行 复习下普通函数执行发生了什么: 开辟一个栈内存,形成私有作用域。 形参赋值。 变量提升。 代码执行。 栈内存释放。 构造函数执行 当我们用new运算符new一个构造函数产生一个实例时,比如说: var obj = new Func 时,其背后的步骤是这样的: 像普通函数一样开辟栈内存,形成一个私有作用域。 形参赋值,变量提升。都是私有变量。 【构造函数执行独有的默认运行机制】,...原创 2020-02-05 18:57:05 · 237 阅读 · 0 评论 -
前端值得一探究竟特辑 --- 快速掌握bind、call、apply的区别
call 和 apply 的主要作用,是改变对象的执行上下文,并且是立即执行的。 bind 也能改变对象的执行上下文,它与 call 和 apply 不同的是,返回值是一个函数,并且需要稍后再调用一下,才会执行。 下面进行详细解释: call和apply的共同点 call和apply都能够改变函数执行时的上下文,将一个对象的方法交给另一个对象来执行,并且是立即执行的。 调用 call 和 app...原创 2020-02-05 17:48:50 · 300 阅读 · 0 评论 -
前端值得一探究竟特辑 --- 数组的常见API
来自ES5的Array API 1. str.split() 拆分字符串变成数组(对字符串操作) "we are here".split(" "); // ["we", "are", "here"] 2. arr.join() 操作数组变成字符串(对数组操作) ["we", "are", "here"].join("-"); // "we-are-here" 3. arr.concat(...原创 2020-01-17 17:58:05 · 529 阅读 · 0 评论 -
前端值得一探究竟特辑 --- 原始值和引用值类型及数据类型的判别
1. 原始值和引用值类型及区别 原始类型 保存为简单数据值。 引用类型 保存为对象,其本质是指向内存位置的引用。 2. 数据类型的判别 1. typeof:基本类型 使用typeof判定数据类型,只能区分基本类型。(number, string, boolean, undefined, null, symbol),特注意typeof null => object, 可以理解为null是一个指...原创 2020-01-17 14:10:20 · 295 阅读 · 0 评论 -
前端值得一探究竟特辑 --- 防抖与节流
防抖 防抖函数的作用就是控制函数在一定时间内的执行次数。防抖意味着N秒内函数只会被执行一次,如果N秒内再次被触发,则重新计算延迟时间。 以乘车刷卡的情景举例,只要乘客不断地在刷卡,司机师傅就不能开车,乘客刷卡完毕之后,司机会等待几分钟,确定乘客坐稳再开车。如果司机在最后等待的时间内又有新的乘客上车,那么司机等乘客刷卡完毕之后,还要再等待一会,等待所有乘客坐稳再开车。 防抖函数分为非立即执行版和立即...原创 2020-01-16 15:55:08 · 512 阅读 · 0 评论 -
前端值得一探究竟特辑 ---深拷贝与浅拷贝
1、什么是深拷贝和浅拷贝 浅度拷贝:复制一层对象的属性,并不包括对象里面的为引用类型(Object, Array )的数据,当改变拷贝的对象里面的引用类型时,源对象也会改变。 深度拷贝:重新开辟一个内存空间,需要递归拷贝对象里的引用,直到子属性都为基本类型。两个对象对应两个不同的地址,修改一个对象的属性,不会改变另一个对象的属性。 2、手撕深度拷贝 function deepClone(s...原创 2020-01-14 14:57:39 · 384 阅读 · 0 评论 -
前端值得一探究竟特辑 --- 五种垂直居中
1、利用inline元素和伪元素 设置伪元素。vertical-align属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。 即:有两个行内元素a和b,a和b都是img, 如果a加了vertical-align:middle样式,b的 底部(基线) 就会对齐a的中间位置; 如果a和b都加了一个vertical-align:middle样式。 那么就互相对齐了对方的中间位置; 也就是它们在垂...原创 2019-09-16 10:48:04 · 470 阅读 · 0 评论 -
前端值得一探究竟特辑 --- 字体大小单位px、em、rem、%
字体大小单位px、em、rem原创 2019-08-28 21:46:45 · 498 阅读 · 0 评论 -
前端值得一探究竟特辑 --- 特殊行内元素img
可设置宽高的行内元素 图片预加载占位 CSS3新增属性原创 2019-08-20 15:10:34 · 293 阅读 · 0 评论 -
前端值得一探究竟特辑 --- meta标签属性总结
设置charset字符集 此属性声明网页的字符编码方式。 常用字符集: UTF-8:包含全世界所有国家需要用的字符 GB2312:国家标准码,简体中文,6763个汉字 BIG5:繁体中文,港澳台使用 GBK:国标扩展,支撑繁体中文,包括全部中文字符 ...原创 2019-08-19 12:48:14 · 525 阅读 · 0 评论 -
前端值得一探究竟特辑 --- BFC(块级格式化上下文)、BFC清除浮动、BFC自适应两栏布局
参考文章 以前对于BFC的理解相当肤浅和片面,这次决定把BFC好好理解清楚。 1、块级格式化上下文(Block formatting context) 并不是块级元素就是BFC呀,哎哟我滴小撒瓜···哭了···太难了··· BFC(Block formatting context)直译为"块级格式化上下文"。它是一个独立的渲染区域,只有Block-level box参与, 它规定了内部的Bloc...原创 2019-08-29 14:07:14 · 215 阅读 · 0 评论