wenxiaowen677-CSDN博客

原创 JS：String 方法大总结（至 ES6）

String方法名字符方法charAt、charCodeAt、codePointAt、normalize字符串拼接方法concat、slice、substr、substring字符串位置方法indexOf、lastIndexOf、includes、startsWith、endsWith去除首尾空格trim、trimStart、trimEnd字符串...

2020-02-24 17:49:01 669

原创 JS：Array 方法大总结（至 ES6）

Array方法名影响原数组检测数组instanceof、Array.isArray()创建数组from、of、fill转换方法valueOf、toString、toLocaleString、join、flat、flatMap栈方法（尾）push、pop√队列方法（首）shift、unshift√重排序方法reverse、so...

2020-02-24 17:48:29 300

原创原型与原型链知识梳理

总结原型的理解：每个函数对象都有原型对象，构造函数生成实例时，该属性会称为实例对象的原型，原型对象用来定义所有实例共享的属性的方法。原型链的理解：每个对象都有 __proto__ 属性，指向其构造函数的原型对象。构造函数的原型对象也是对象，也有自己的 __proto__ 属性，由此形成原型链。对象方法查找时，在本身找不到时，向原型链上找。js 继承机制的设计思想是，原型对象的所有属性和...

2020-02-08 22:20:09 260

原创 CSS 盒模型

总结CSS 盒模型有两种，标准盒模型和 IE 盒模型，两者区别在于 width 的计算。标准盒模型中，width 为 content 宽度，ie 盒模型中，width 为 content\padding\border 三者的宽度。可以用 css3 中的box-sizing 属性更改浏览器默认的盒模型，设置为 border-box 为 ie 盒模型，content-box 为标准盒模型。外边...

2020-02-05 22:08:47 148

原创捋一下浏览器存储 —— cookie/webstorage

cookie 与 webStorage 的主要区别webStorage 包括 localStorage 和 sessionStorage生命周期：cookie 可以设置过期时间，max-age 设置为0时直接删除，不设置或设置为负值时浏览器关闭时失效；localStorage 除非手动或代码删除，sessionStorage 在当前会话关闭时删除大小：cookie 远远小于 webStor...

2020-02-04 19:50:10 206

原创 JS 浅拷贝与深拷贝

总结浅拷贝只复制对象第一层的属性，新旧对象的子对象共享一块内存。Object.assign()、Array 的 concat、slice 方法。深拷贝实现新旧对象数据相同，但是存在各自独立的内存中。lodash 的_cloneDeep、JSON.parse(JSON.stringify())、以及手写递归方法等。浅拷贝浅拷贝只复制对象第一层的属性，而不复制对象本身，新旧对象的子对象还是...

2020-02-02 21:03:25 108

原创 JS 对象遍历

方法是否继承是否包含不可枚举是否包含 SymbolObject.keys() Object.values() Object.entries()否否否Object.getOwnPropertyNames()否是否Reflect.ownKeys()否是是for…in是否否for…of 不能遍历普通对象，有两个方法可以实现，见下文...

2020-01-19 16:02:27 262

原创 JS 正则表达式相关方法整理

REGEXP 对象JS 通过内置对象 RegExp 支持正则表达式。有两种方法实例化 RegExp 对象：字面量、构造函数。字面量：var reg = /\bis\b/g构造函数：var reg = new RegExp(’\bis\b’,‘g’)创建方法的区别1在引擎编译代码时新建正则表达式，2在运行时新建正则表达式，所以1效率更高，而且1比较遍历和直观，在实际应用中...

2020-01-18 16:49:21 160

原创 JS 中的稀疏数组和密集数组

一般来说，js 中的数组是稀疏的。稀疏就是，数组的元素之间可以有空隙，因为一个数组其实就是一个键值映射。稀疏数组创建一个指定长度的稀疏数组很简单。var arr = new Array(3);遍历时，它没有元素，js 会跳过这些缝隙。密集数组创建方法一var a = Array.apply(null,Array(3));Array.apply(null, Array(3)).m...

2020-01-17 11:19:24 503

原创 JS 数组去重

总结去重方法10w数据耗时ms复杂数据去重效果双重循环3139普通类型除了 NaN，引用数据类型不能Array.prototype.indexOf()2784普通类型除了 NaN，引用数据类型不能Array.prototype.sort()53普通类型除了 NaN，引用数据类型不能Array.prototype.includes()3018...

2020-01-16 14:48:58 583

原创 V8 内存浅析

总结V8 使用 c++ 开发，主要应用于 Google chrome 和 node.js 中。内存构成为：new space：大多数对象，小，回收频繁old space：只保存原始数据对象，没有指向其它对象的指针large object space：有自己的内存，不会移动大对象区code space：代码对象，唯一拥有执行权限的内存map：cell 和 map，每个区域...

2020-01-15 19:34:58 441

原创 JS 中的内存回收和内存泄露

总结js 的垃圾回收是周期性的，根据判断变量是否在被继续使用，如果不被使用则作为垃圾回收常用的策略是引用计数和标记清除。引用计数判断变量是否有指向它的引用，没有的话回收，这种方式有循环引用的问题；标记清除判断变量是否可达，不可达则回收。内存泄露可以通过 chrome 开发者工具进行快照 snapshot 或者 memory record，也可以通过这种方式进行问题排查内存泄露可能原因：意...

2020-01-14 15:17:06 445

原创 Symbol 类型

总结Symbol 是一个基础数据类型，表示独一无二的值，可以用于消除魔术字符串。Symbol 的创建不用new操作符，直接用 Symbol(val)。Symbol 可以作对象属性，该属性是唯一的，Symbol 作为对象属性名时，不能用点运算符。获取对象中的 Symbol 属性，可以用 Object.getOwnPropertySymbols 或 Reflect.ownKeys。常用方法...

2020-01-13 15:37:29 1386

原创 JS 中的 == 与 ===

=== 严格运算符：类型不同就不相等如果类型不同，就[不相等]如果两个都是数值，并且是同一个值，那么[相等]；如果其中至少一个是 NaN，那么[不相等]。（判断一个值是否是 NaN，只能用 isNaN() 来判断）如果两个都是字符串，每个位置的字符都一样，那么[相等]；否则[不相等]。如果两个值都是 true，或者都是 false，那么[相等]。如果两个值都引用同一个对象或函数，那么[...

2020-01-10 19:32:07 111

原创 JS 数据类型理解

值类型变量本身含有赋予给它的数值，它的变量本身及保存的数据都存储在栈的内存块当中。Undefined Null Boolean Number String Symbol（es6新增）NumberNumber 类型包含整数和浮点数（浮点数数值必须包含一个小数点，且小数点后面至少有一位数字）两种值。NaN: 非数字类型。特点：① 涉及到的任何关于 NaN 的操作，都会返回 NaN ② ...

2020-01-10 19:31:39 125

原创 0.1+0.2=?

计算机中用二进制来存储小数，大部分小数转成二进制之后都是无限循环的值，因此存在取舍问题，也就是精度丢失。解决方案：使用 mathjs、使用 tofixed、小数和整数分开相加、与 Math.pow(2,-52) 比较（如下）function equal(number1, number2) {return Math.abs(number1 - number2) < Math.pow(2,...

2020-01-10 19:31:06 217

原创 babel 原理三：babel 的工作原理

更新 babel7.xpreset 的变更：淘汰 es201x、删除 stage-x、强推 envnpm package 名称的变化：把所有 babel-* 重命名为 @babel/*不再支持低版本 node：要求 nodejs>=6only 和 ignore 匹配规则的变化@babel/node 从 @babel/cli 中独立了babel-upgradebabel 的工作原...

2020-01-10 19:30:31 1107

原创 babel 原理二：babel 的配置

babel 的配置使用形式命令行：babel 的设置以命令行参数的形式package.json：在 babel 字段添加设置.babelrc 文件：推荐使用常用 options 字段说明env: 指定在不同环境下使用的配置。env 字段从 process.env.BABEL_ENV 获取，不存在的话从 process.env.NODE_ENV 获取，如果还是不存在，则取默认值 d...

2020-01-10 19:28:12 212

原创 babel 原理一：babel 包的构成

babel 的包的构成核心包babel-core: babel 转译器本身，提供了 babal 的转译 API，如 babel.transform 等，用于对代码进行转译babylon: js 的词法解析器（babel 7.x 重命名为 @babel/parser）babel-traverse: 用于对 AST 的遍历，主要给 plugin 用babel-generator: 根据 AS...

2020-01-10 19:27:29 282

原创个人网站搭建与wordpress配置

网站搭建建站教程来自师兄公众号 flyzy小站1.购买VPS服务器与域名（阿里云、NameSilo等）。2.用XShell连接服务器，安装mysql/niginx/php。3.安装wordpress，创建wordpress操作的数据库和用户，配置wordpress，配置nginx。以上三步基本上网站建立完成。wordPress仪表盘配置选择主题wordpress提供...

2019-06-01 16:43:12 410

原创 CSS原生变量使用教程和几个Tips

CSS使用教程2017年3月，Edge浏览器支持CSS变量。声明变量名前面要加两根连词线(--)body { --foo: #7F583F; --bar: #F7EFD2;}上面代码中有两个变量，--foo 和 --bar（为什么用--？因为$被Sass用了，@被less用了）各值都可以放入CSS变量，比如变量名中带-。变量名大小写敏感。var()函数...

2019-06-01 01:04:40 348

原创 CSS：为什么我不再使用Sass（译）

本文总览前段时间学习了Sass，像Sass这样的预处理器优点在于：变量及Mixin可以减少css中的重复问题；嵌套使父子关系更加清晰；继承可以避免代码重复问题；便捷的函数功能和自定义函数等等。但是呢，偶然间看到这篇文章，why-i-stopped-using-sass，作者说明了不再使用Sass的原因，好奇心使我点了进去，并进行了渣翻。文中作者说明了用Sass解决了哪些问题，为什么后来不用...

2019-06-01 00:04:56 519

原创地图大量数据查询与渲染——bug及解决方案

本文记录大数据可视化项目中信息查询过程遇到的实际问题及解决方案，用到了Vue自定义组件、Promise.all、DocumentFragment、event loop等。项目需求项目使用的arcgis地图服务中主要地图要素为图斑即面状要素，需要根据图斑属性对图斑进行查询，获得符合要求的图斑并高亮显示。问题及解决方案总结问题1属性查询多条件组合问题：简单易懂的多条件的输入解决...

2019-05-14 12:39:25 4731

原创 JS：非核心代码延迟加载方法

延迟加载方法1.script标签的defer\async属性，均能在html解析时加载，均只适用于外部脚本文件。defer会按照顺序执行，async不会。2.使用最多的方法：动态创建DOM的方法。新建<script>元素，添加到DOM。3.jquery.getScript()方法，加载并在全局作用域下执行脚本，jQuery.getScript()不会缓存。$.getScri...

2019-04-01 21:31:25 2219

原创 JS：位运算简单总结与实用技巧

目录位运算基础按位与（&）按位或（|）按位非（~）按位异或（^）有符号左移（<<）有符号右移（>>）无符号右移（>>>）其他应用实例（待补充）n&(n-1)判断一个数是否为2的幂求数中某一个数的二进制表示中1的个数位运算执行效率更高比一般的数值运算效率更高。位运算基础按位与（&am...

2019-02-20 19:48:17 536

原创 CSS：如何使用px、em、rem？

目录1. 三种单位详解1.1 px（像素Pixel）1.2 em1.2.1 浏览器默认16px1.2.2font-size继承特性1.2.3margin和padding3. rem（root rem）2. 应用场景2.1 通用准则2.2 em与rem1. 三种单位详解1.1 px（像素Pixel）相对长度单位。像素px是相对于显示器屏幕...

2019-01-22 21:11:36 1189

原创 ArcGIS API for JS：实现属性查询

项目记录：关于ArcGIS APIfor JS查询方法的比较和应用查询方法比较：FindTask、QueryTask、IdentifyTask不同点FindTask只能进行属性查询，QueryTask,IdentifyTask两个类既可以进行属性查询也可以进行空间查询。对于QueryTask,IdentifyTask两个类，QueryTask只可应用于一个单独的图层，Identi...

2018-10-08 16:46:32 3021

waiting677的博客