前端插件库DataTables官网：https://www.datatables.net/
DataTables是jQuery的JavaScript函数库，目的是强化表格操作（如搜索、排序），并自动加入组件引入表格中，使用非常灵活简便。
LazyLoad官网：Lazy Load延伸：Vanilla JavaScript Lazy Load Plugin
Lazy Load帮助高度较长的网页进行延迟载入图片，尚未浏览到该部分时，不会载入视角外的图片，提高效率。
lightSlider官网：JQuery lightSliderGithub：sachinchoolur/lightslider
JQuery lightSlider是一个轻量且响应式的跑马灯/幻灯片，附有缩图导览。另外还有相本功能、垂直跑马灯，应用层面广泛。
alertify.js官网：https://fabien-d.github.io/alertify.js/Github：alertify.js
alertify.js是为了美化通知信息而生的JavaScript框架。
pickadate.js ...
JS原型链1234567891011function Person() {}Person.prototype.name = "abc";Person.prototype.sayName = function () { console.log(this.name);};let person = new Person();person.__proto__ = Person.prototype;String.__proto__ = Function.prototype;String.constructor = Function;
原型继承12345678910function Parent() { this.name = "Parent"; this.sex = "male";}function Child() { this.name = "Child";}Child.prototype = new Parent();
构 ...
虚拟列表：只渲染可视区域元素，通过占位容器模拟滚动条。树的特殊性：需出来层级关系、展开折叠动态变化，二者结合即为虚拟树（Virtual Tree）。
数据结构转化递归遍历树节点，转化为线性数组并记录层级、展开状态、父子关系：
12345678function flattenTree(root, level = 0, result = []) { const node = { ...root, level, expanded: false }; result.push(node); if (node.children && node.expanded) { node.children.forEach(child => flattenTree(child, level + 1, result)); } return result;}
滚动事件通过容器scrollTop动态计算当前可视区域索引：
12const startIdx = Math.floor(scrollTop / itemH ...
这是一个系列笔记，来自《Web前端黑客技术揭秘》这本书，属于进阶内容，可以进一步提高Web开发的能力。
Web安全的关键点数据和指令
SQL注入攻击
selct username,email,desc from users where id=1
攻击者提交：
union select password,1,1 from users
最终SQL查询语句：
selct username,email,desc from users where id=1 union select password,1,1 from users
组成的SQL语句合法，通过一个经典的union查询，此时注入的指令内容就会被当做合法指令执行。这样的攻击会导致users表中的password泄露。
XSS跨站脚本攻击
eval函数能够动态执行url返回的特定信息，比如eval(location.hash.substr(1))即是截取#后的callback内容，提供给eval进行动态执行。
如果攻击者对#后的url中的#后的内容进行改造，就可以截取到访问者的cookies会话信息，其中可能包含访问者的账号、密 ...
基本选择器 Basics
*选择所有元素
.class选择class，如：$('.mybox')
element选择element，如：$('p')
#id选择id，如：$('#box')
selector1,selectorN可以同时选择多个元素，如：$('div, p.box, #phone')
层级选择器 Hierarchy
parent > child选择指定元素下的指定子元素，如：$('ul.tonav > li')
ancestor descendant选择一个元素里所有的后代元素，如：$('form input')
prev + next选择所有指定元素后紧跟着的元素，如：$('label + input')
prev ~ siblings选择与指定元素之后有相同父级的同级选择器，如：$('#prev ~ div')
基本过滤器 Basic Filters
:animated选择动画进行中的所有元素。如：$('div: ...
插件
Beautify
chinese Language
open in browser
Vetur
minapp
settings.json123456789101112131415161718192021222324{ "window.zoomLevel": 1, "markdown.preview.fontSize": 16, "[html]": { "editor.defaultFormatter": "HookyQR.beautify" }, "[javascript]": { "editor.defaultFormatter": "HookyQR.beautify" }, "[json]": { "editor.defaultFormatt ...
特性
类型批注 和编译时类型检查
类型推断
类型擦除
接口
枚举 enum
mixin
泛型编程
名字空间
元组 tuple
类型
boolean 布尔值
number 数值
string 字符串
any
array 数组
tuple 元组
enum 枚举
undefined null
void 空类型 方法没有返回值
never 任何类型的子类型 代表不会出现的值
object 对象
基本类型 增加void any enum never
引用类型
高级类型
交叉类型
联合类型
类型别名
类型索引
类型约束
类型映射
条件类型
交叉类型
& 将多个类型合并为一个类型 并 T & U 表示 T 和 U 的交集
123456789101112131415function extend<T, U>(first: T, second: U): T & U { let result:<T & U> = {}; for (let key in first) { ...
商品计价的千分位分隔符转换1return total.toString().replace(/\B(?=(\d{3})+$)/g, ',')
去除字符串的空格
字符串原生trim方法，只能去除两侧空格，返回新字符串
replace正则匹配
去除所有空格：str = str.replace(/\s*/g,"")
去除两侧空格：str = str.replace(/^\s*|\s*$]/g,"")
去除左侧空格：str = str.replace(/^\s*/,"")
去除右侧空格：str = str.replace(/\s*$/,"")
中文、英文、数字但不包括下划线等符号
中文：^[\u4e00-\u9fa5]{0,}$
中文、英文、数字：^[\u4e00-\u9fa5A-Za-z0-9_]+$（包括下划线），[\u4e00-\u9fa5A-Za-z0-9]+$/[\u4e00-\u9fa5A-Za-z0-9]{ ...
项目需求：1、用nodejs的socket.io写了一个简易版的聊天室（实时推送技术，无刷新实现信息实时更新，应用于在线聊天室、在线客服系统、评论系统和WebIM等）
2、根据socket.io库给出的api以及《nodejs实战》给出的demo实现了, 也只是很基础的, 但放到服务器上后会有网络延迟, 顺序不正确等问题
3、看过网上的资料, 没看到有解释很全或者投入生产环境的代码, 都是一些demo
想请教前辈, 对于一个业务开发中常用的聊天室模块:
1、应该如何去思考呢?2、整个过程会涉及到哪些知识点?3、会有哪些难点呢?(比如支持高并发啥的)4、应该注意什么呢?(比如如何测试或者啥的?)
解决方案需求分析：
实现在线聊天室的基本功能，包括显示在线用户的个人信息
用户进行实时聊天，信息推送实时更新
其他可扩展功能
技术栈分析socket.io是一个开源WebSocket库，它通过Node.js实现WebSocket服务端，同时提供客户端JS库。socket.io支持以事件为基础的实时双向通讯，可以工作在任何平台、浏览器或移动设备。
Node.js+ ...
简介Pixi-2D sprite渲染引擎。
