面试知识点
文章平均质量分 72
面试
wflynn
研究代码中...将随缘更新
展开
-
简单的两个数组取以及找出不同项
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.10.0/jquery.min.js" type="text/javascript"></script></head&g.原创 2021-02-03 20:22:49 · 1207 阅读 · 0 评论 -
[‘1‘, ‘2‘, ‘3‘].map(parseInt)
<script> let arr = [1.1, 5, 80] let new_arr = arr.map(parseInt) // 当 map 中使用的方法只需要一个参数时可省略 // 等价于 => let new_arr = arr.map((item, index) => { return parseInt(item, index) }) // 返回的值分别为 parseInt('1', 0) // 1.原创 2021-01-06 18:33:54 · 114 阅读 · 0 评论 -
动态加载js的异步与同步方法
同步加载(会阻塞后续代码执行)loadAsyncScript(src, callback = function () {}) { // 同步加载js const head = document.getElementsByTagName('head')[0]; const script = document.createElement('script'); ...原创 2020-03-31 09:08:23 · 1418 阅读 · 1 评论 -
对象的解构赋值
对象的解构赋值对象解构的基本用法:let {a, b} = {a: 'aaaa', b: 'bbbb'} // a='aaaa' b='bbbb'let obj = {d: 'aaaa', e: {f: 'bbbb'}}let {d, e:{f}} = obj // 嵌套解构 d='aaaa' f='bbbb'let g;(g = {g: 'aaaa'}) // 已声明变量解构 ...原创 2019-12-06 15:01:20 · 2697 阅读 · 0 评论 -
解构赋值用途与解构赋值圆括号问题
圆括号问题对于编译器来说,一个式子到底是模式,还是表达式,没有办法从一开始就知道,必须解析到(或解析不到)等号才能知道。 由此带来的问题是,如果模式中出现圆括号怎么处理。ES6 的规则是,只要有可能导致解构的歧义,就不得使用圆括号。 但是,这条规则实际上不那么容易辨别,处理起来相当麻烦。因此,建议只要有可能,就不要在模式中放置圆括号。不能使用圆括号的情况以下三种解构赋值不得使用圆括号...原创 2019-12-06 15:09:31 · 731 阅读 · 0 评论 -
ES6面试点-模板字符串
传统的 JavaScript 语言,输出模板通常是这样写的(下面使用了 jQuery 的方法)。$('#result').append( 'There are <b>' + basket.count + '</b> ' + 'items in your basket, ' + '<em>' + basket.onSale + '</e...原创 2019-12-06 16:06:55 · 216 阅读 · 0 评论 -
ES6的Map常用用法
Map与数组的关系var kvArray = [["key1", "value1"], ["key2", "value2"]];// 使用常规的Map构造函数可以将一个二维键值对数组转换成一个Map对象var myMap = new Map(kvArray);myMap.get("key1"); // 返回值为 "value1"// 使用Array.from函数可以将一个Ma...原创 2019-12-09 14:19:35 · 415 阅读 · 0 评论 -
WeakSet
WeakSet 含义WeakSet 结构与 Set 类似,也是不重复的值的集合。但是,它与 Set 有两个区别。首先,WeakSet 的成员只能是对象,而不能是其他类型的值。const ws = new WeakSet();ws.add(1)// TypeError: Invalid value used in weak setws.add(Symbol())// TypeE...原创 2019-12-09 14:22:09 · 151 阅读 · 0 评论 -
WeakMap
什么是WeakMapWeakMap结构与Map结构类似,也是用于生成键值对的集合。// WeakMap 可以使用 set 方法添加成员const wm1 = new WeakMap();const key = {foo: 1};wm1.set(key, 2);wm1.get(key) // 2// WeakMap 也可以接受一个数组,// 作为构造函数的参数const k...原创 2019-12-09 14:33:06 · 172 阅读 · 0 评论 -
class的继承
类的继承class ZxxSubFn extends ZxxFn { constructor (name, age, salary) { super(name, age); // 调用父类的构造方法 this.salary = salary } // 父类的方法重写 showName () { console.l...原创 2019-12-09 15:15:02 · 155 阅读 · 0 评论 -
Miofly
浏览器解析渲染页面过程 在考虑闭包的情况下JS变量存储在栈与堆的区分 什么是Promise,Promise的三种状态 为什么要使用Promise,Promise的优点 Promise容易出错的理论面试题 Event Loop详解 JS异步之宏队列与微队列 浏览器渲染页面常见问题 详解JavaScript的进程和线程,js为什么是单线程,js的异步执行原理 js操作DOM为什么会影...原创 2019-12-10 17:00:38 · 139 阅读 · 0 评论 -
箭头函数
基本用法ES6 允许使用“箭头”(=>)定义函数。var f = v => v;// 等同于var f = function (v) { return v;};如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。var f = () => 5;// 等同于var f = function () { return 5 };v...原创 2019-12-16 15:24:55 · 439 阅读 · 0 评论 -
移动端项目设配UI设计图方法
由于要使用UI的设计图,所以需要根据UI设定的尺寸来写页面下面是移动端适配的方法在script标签中执行<script> (function (doc, win) { var docEl = doc.documentElement, isIOS = navigator.userAgent.match(...原创 2020-04-14 09:19:52 · 807 阅读 · 0 评论 -
while循环详解
while语句可以在某个条件表达式为真的前提下,循环执行指定的一段代码,直到那个表达式不为真时结束循环。原创 2019-12-18 17:28:04 · 409 阅读 · 0 评论 -
propertyIsEnumerable
propertyIsEnumerable()方法返回一个布尔值,表示指定的属性是否可枚举。每个对象都有一个 propertyIsEnumerable 方法。此方法可以确定对象中指定的属性是否可以被 for...in 循环枚举,但是通过原型链继承的属性除外。如果对象没有指定的属性,则此方法返回 false。基本用法var o = {};var a = [];o.prop = 'i...原创 2019-12-23 13:48:49 · 671 阅读 · 0 评论 -
JavaScript 里分号是必须的吗?
有时由于 JavaScript 的分号自动插入机制,解释器会在多数语句后放置分号。这就意味着在大多数情况下分号可以被忽略然而,有些情况分号是必须的。在块的开始不需要加分号,但是如果它们遵循在一行并且:行的开始是[const previousLine = 3;[1, 2, previousLine].map(n => n * 2)行的开始是(const previou...原创 2019-12-26 17:07:56 · 1270 阅读 · 0 评论 -
节流
节流的原理很简单:如果你持续触发事件,每隔一段时间,只执行一次事件。根据首次是否执行以及结束后是否执行,效果有所不同,实现的方式也有所不同。我们用 leading 代表首次是否执行,trailing 代表结束后是否再执行一次。关于节流的实现,有两种主流的实现方式,一种是使用时间戳,一种是设置定时器。第一种方法:使用时间戳,当触发事件的时候,我们取出当前的时间戳,然后减去之前的时间...原创 2019-12-30 16:45:37 · 515 阅读 · 0 评论 -
不借助第三者交换 a,b两个值。
/* 方法一 */a = a + b;b = a - b;a = a - b;/* 方法二 */a = a - b;b = a + b;a = b - a;/* 方法三 */a = {a:b,b:a};b = a.b;a = a.a;/* 方法四 */a = [a,b];b = a[0];a = a[1];/* 方法五 */[a,b] = [b,a];...原创 2019-12-30 16:59:04 · 105 阅读 · 0 评论 -
从浏览器地址栏输入url到显示页面的步骤
在浏览器地址栏输入URL 浏览器查看缓存,如果请求资源在缓存中并且新鲜,跳转到转码步骤 如果资源未缓存,发起新请求 如果已缓存,检验是否足够新鲜,足够新鲜直接提供给客户端,否则与服务器进行验证。 检验新鲜通常有两个HTTP头进行控制Expires和Cache-Control: HTTP1.0提供Expires,值为一个绝对时间表示缓存新鲜日期 HTTP1.1增加了Cache-...原创 2019-12-31 09:30:54 · 244 阅读 · 0 评论 -
Object.getOwnPropertyNames(obj)
Object.getOwnPropertyNames(obj)返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组。 数组中枚举属性的顺序与通过 for...in 循环(或 Object.keys)迭代该对象属性时一致。 数组中不可枚举属性的顺序未定义。示例var arr = ["a", "b", "c"];console.l...原创 2019-12-18 14:23:14 · 618 阅读 · 0 评论 -
将多层级数组转化为一级数组(即提取嵌套数组元素最终合并为一个数组)
需求:多维数组=>一维数组let ary = [1, [2, [3, [4, 5]]], 6];// -> [1, 2, 3, 4, 5, 6]1. 调用ES6中的flat方法ary = ary.flat(Infinity);flat()方法会移除数组中的空项:var arr4 = [1, 2, , 4, 5];arr4.flat();// [1, 2...原创 2019-11-27 15:37:40 · 3800 阅读 · 0 评论 -
JS面试点- bind / call / apply
bind / call / apply 可用于this的显式绑定this绑定的是 call,apply,bind 的第一个参数call()方法var a = { user: 'zxx', fn: function () { console.log(this.user) // zxx }}var b = a.fnb.call(a)通过在...原创 2019-11-27 15:55:17 · 177 阅读 · 0 评论 -
在考虑闭包的情况下JS变量存储在栈与堆的区分
变量存储在闭包中的问题按照常理来说栈中数据在函数执行结束后就会被销毁,那么 JavaScript 中函数闭包该如何实现,先简单来个闭包:function count () { let num = -1; return function () { num++; return num; }}let numCount = count...原创 2019-11-28 10:33:05 · 2682 阅读 · 5 评论 -
Event Loop详解
Event Loop先举一个列子console.log('start');setTimeout(() => { console.log('timeout');});Promise.resolve().then(() => { console.log('resolve');});console.log('end');刚开始整个脚本作为一个宏任务来执行,对于...原创 2019-11-28 14:11:40 · 561 阅读 · 2 评论 -
执行上下文详解
当执行 JS 代码时,会产生三种执行上下文全局执行上下文 函数执行上下文 eval 执行上下文每个执行上下文中都有三个重要的属性变量对象(VO),包含变量、函数声明和函数的形参,该属性只能在全局上下文中访问 作用域链(JS 采用词法作用域,也就是说变量的作用域是在定义时就决定了) thisvar a = 10function foo(i) { var b = 20}...原创 2019-11-28 15:08:27 · 468 阅读 · 0 评论 -
forEach循环详解
forEach()方法对数组的每个元素执行一次给定的函数。indexarrayforEach()thisArg: 可选,当执行回调函数callback时,用作this的值。undefined。原创 2019-11-28 15:55:15 · 11941 阅读 · 0 评论 -
JS实现二分搜索
二分查找的前提为:数组、有序。逻辑为:优先和数组的中间元素比较,如果等于中间元素,则直接返回。如果不等于则取半继续查找。非递归实现function binarySearch(arr, target){ var h = arr.length - 1, l = 0; while(l <= h){ var m = Math.floor((h...原创 2019-11-28 16:40:15 · 193 阅读 · 0 评论 -
css面试点-css层叠上下文
什么是层叠上下文层叠上下文(stacking context),是HTML中一个三维的概念。在CSS2.1规范中,每个盒模型的位置是三维的,分别是平面画布上的X轴,Y轴以及表示层叠的Z轴。一般情况下,元素在页面上沿X轴Y轴平铺,我们察觉不到它们在Z轴上的层叠关系。而一旦元素发生堆叠,这时就能发现某个元素可能覆盖了另一个元素或者被另一个元素覆盖。 如果一个元素含有层叠上下文,(也就是说它是层叠...原创 2019-12-02 20:10:46 · 549 阅读 · 0 评论 -
css面试点总结一
css面试点-css盒子模型 css面试点-flex布局,css3弹性盒子模型 css面试点-BFC(块级格式化上下文)与常见布局方案 css面试点-css层叠上下文 css面试点-div居中方法(共8种) css面试点-清除浮动方法(9种方法) css面试点-css隐藏元素方法大全,visibility的collapse属性值详解 css面试点-元素选择符与关系选择符 css面试...原创 2019-12-03 08:55:14 · 115 阅读 · 0 评论 -
css面试点总结2
css面试点-@import与link的详解 css面试点-position属性 css面试点-CSS预处理器(Sass/Less/Postcss) css面试点-css3的filter详解原创 2019-12-03 08:56:09 · 94 阅读 · 0 评论 -
JS判断数据类型
怎么判断对象类型?可以通过 Object.prototype.toString.call(xx)。这样我们就可以获得类似 [object Type] 的字符串。 instanceof 可以正确的判断对象的类型,因为内部机制是通过判断对象的原型链中是不是能找到类型的 prototype。封装好的函数judgeType (obj) { let class2type = {};...原创 2019-12-03 09:47:04 · 136 阅读 · 0 评论 -
Object.getPrototypeOf(obj)
Object.getPrototypeOf(obj)返回指定对象的原型(内部[[Prototype]]属性的值)。 obj:要返回其原型的对象。 返回值:给定对象的原型。如果没有继承属性,则返回 null 。var proto = {};var obj = Object.create(proto);Object.getPrototypeOf(obj) === proto; // ...原创 2019-12-03 13:57:46 · 3035 阅读 · 0 评论 -
正则表达式
正则表达式中的特殊字符字符 含义 \ 依照下列规则匹配: 在非特殊字符之前的反斜杠表示下一个字符是特殊字符,不能按照字面理解。例如,前面没有 "\"的 "b"通常匹配小写字母 "b",即字符会被作为字面理解,无论它出现在哪里。但如果前面加了 "\",它将不再匹配任何字符,而是表示一个字符边界。 在特殊字符之前的反斜杠表示下一个字符不是特殊字符,应该按...原创 2019-12-04 16:40:29 · 185 阅读 · 0 评论 -
数组的find/findIndex详解
find()返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。 find方法对数组中的每一项元素执行一次callback函数,直至有一个callback 返回true。当找到了这样一个元素后,该方法会立即返回这个元素的值,否则返回undefined。 注意callback函数会为数组中的每个索引调用即从0到length - 1,而不仅仅是那些...原创 2019-12-05 10:21:18 · 7820 阅读 · 0 评论 -
Iterator遍历器
Iterator(遍历器)的概念JavaScript 原有的表示“集合”的数据结构,主要是数组(Array)和对象(Object),ES6 又添加了Map和Set。 这样就有了四种数据集合,用户还可以组合使用它们,定义自己的数据结构,比如数组的成员是Map,Map的成员是对象。这样就需要一种统一的接口机制,来处理所有不同的数据结构。 遍历器(Iterator)就是这样一种机制。它是一种接口......原创 2019-12-05 10:44:23 · 1311 阅读 · 0 评论 -
数组的Map方法详解
map():创建一个新数组,这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。indexarraymapthisArg: 可选,执行callback函数时值被用作this返回值:一个由原数组每个元素执行回调函数的结果组成的新数组。mapcallbackcallbackundefinedcallbackdeletemapcallback因为map生成一个新数组,当你不打算使用返回的新数组却使用请用forEach或者for-of替代。原创 2019-12-05 11:10:08 · 17115 阅读 · 2 评论 -
数组的reduce()和reduceRight()方法
reduce()对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。reducer函数接收4个参数:Accumulator (acc) (累计器) Current Value (cur) (当前值) Current Index (idx) (当前索引) Source Array (src) (源数组)您的reducer函数的返...原创 2019-12-05 14:17:12 · 603 阅读 · 0 评论 -
JS 防抖 实现
在前端开发中会遇到一些频繁的事件触发,比如:window 的 resize、scroll mousedown、mousemove keyup、keydown<!DOCTYPE html><html lang="zh-cmn-Hans"><head> <meta charset="utf-8"> <meta ht...原创 2019-12-05 15:34:55 · 403 阅读 · 0 评论 -
Object.freeze(obj) 深冻结对象
Object.freeze(obj)可以冻结一个对象。一个被冻结的对象再也不能被修改; 冻结了一个对象则不能向这个对象添加新的属性,不能删除已有属性, 不能修改该对象已有属性的可枚举性、可配置性、可写性,以及不能修改已有属性的值。 冻结一个对象后该对象的原型也不能被修改。 freeze()返回和传入的参数相同的对象。 返回值:被冻结的对象。冻结对象未冻结var obj...原创 2019-12-06 12:32:24 · 332 阅读 · 0 评论 -
js内置对象Number的属性
NumberJavaScript 的Number对象是经过封装的能让你处理数字值的对象。Number对象由Number() 构造器创建。语法new Number(value); var a = new Number('123'); // a === 123 is falsevar b = Number('123'); // b === 123 is truea inst...原创 2019-11-22 10:34:18 · 315 阅读 · 0 评论