Dtae() 和 new Date() 区别,Date() 函数不能带参数,属于静态方法
new Date()*1 === new Date().getTime() === Date.now() // 获取时间戳
new Date(y, m, 0).getDate() // 获取这个月有多少天,传入年份和月份
new Date(y, m, 0).getDay() // 获取这个月最后一天是星期几
new Date(y, m-1, 1).getDay() // 获取这个月第一天是星期几
. 点字符匹配除回车(r)、换行(n) 、行分隔符(u2028)和段分隔符(u2029)以外的所有字符
[^] 表示匹配一切字符,其中包括换行符
str.replace(/2/gi, '1') 第二个参数可以使用美元符号$,用来指代所替换的内容
$&:匹配子字符串
$`:匹配结果前面的文本
$':匹配结果后面的文本
$n:匹配成功的第n组内容,n是从1开始的自然数。
$$:指代美元符号$。
'hello world'.replace(/(\w+)\s(\w+)/, '$2 $1')
// "world hello"
'abc'.replace('b', '[$`-$&-$\']')
// "a[a-b-c]c"
console.log(JSON.stringify(obj, null, 2)) 接受三个参数,打印对象格式化
参数一
参数二
参数三
new Error() // 抛出一个错误
new SyntaxError() // 语法解析错误
new ReferenceError() // 非法或不能识别的引用值,使用未声明的变量
new TypeError() // 操作类型错误,使用自身没有的方法,let a = 22 a.sort() a 是 Number 类型而非数组
new RangeError() // 数值越界,Maximum call stack,调用一个不终止的递归函数,计算的值超出最大范围
new URIError() // encodeURIComponent() encodeURI() 等URI函数使用错误
'a' in ['a', 1]
for in for of
arr.push(1, 2, 3)
[1, 2, 3, 4, 5].splice(2) 分离成两个数组 [1, 2] [3, 4, 5]
es6 明确把空位转成 undefined
es5 有的跳过(forEach、filter、reduce、some、every)
map() 会跳过空位,但会保留这个值
join() 和 toString() 会将空位视为 undefined ,而 undefined 和 null 会被处理成空字符串
function rand(num) {
let seed = Date() * 1;
seed = (seed * 9301 + 49297) % 233280; // 为何使用这三个数?
let rc = seed / (233280.0);
return Math.ceil(rc * num);
}
rand(10) // 取1~10的随机数
0 / 0 NaN
0 / 1 0
1 / 0 Infinity
es6 分别用前缀 0b 0o 0x 表示 2 8 16 进制
base64
0~9 a~z A~Z '+' '/' 10 + 26 + 26 + 2 = 64
不足补\x00(零值字节),然后在末尾加上1个或2个=号,表示补了多少个零值字节
Number.MAX_SAFE_INTEGER 9007199254740991 表示能够精确表示的最大整数
Number.MIN_SAFE_INTEGER -9007199254740991 表示能够精确表示的最小整数
ES6 在 Math 对象上新增了 17 个与数学相关的方法。所有这些方法都是静态方法,只能在 Math 对象上调用
Math.trunc() // 去除一个数的小数部分,返回整数部分
Math.trunc(4.1) // 4
Math.trunc(-4.1) // -4
Math.hypot(3, 4) // 5 返回所有参数的平方和的平方根
Math.cbrt(8) // 2 计算一个数的立方根
es6 新增指数运算符 2 ** 2 ** 2 => Math.pow(2, 4)
这个运算符的一个特点是右结合,而不是常见的左结合。多个指数运算符连用时,是从最右边开始计算的。
'hello'[1] // "e" 直接对字符串使用方括号运算符,仅能获取操作
substring 类似slice,但是使用规则违反直觉,因此不建议使用substring方法,应该优先使用slice
str.charAt() // 下标
str.charCodeAt() // 十进制 Unicode 码点
String.fromCharCode(97) // 逆操作
str.substr(0, 4) // 从零开始取4个
str[0]
str.concat(str2)
str1.localeCompare(str2) // Unicode 码点比较大小
宏任务 浏览器 Node
I/O ✅ ✅
setTimeout ✅ ✅
setInterval ✅ ✅
setImmediate ❌ ✅
requestAnimationFrame ✅ ❌
微任务 浏览器 Node
process.nextTick ❌ ✅
MutationObserver ✅ ❌
Promise.then ✅ ✅
// 性能最好
function add(n) {
let res1 = 1;
let res2 = 1;
let sum = res2
for (let i = 2; i < n; i++) {
sum = res1 + res2
res1 = res2
res2 = sum
}
return sum
}
// 把算过的存起来
var cache = []
function add(n) {
if (n <= 2) {
cache[n] = 1
return 1
}
if (cache[n] !== undefined) {
return cache[n]
}
cache.push(add(n-1) + add(n-2))
return cache[n]
}
// 最简单,但是性能不行
function add() {
if (n <= 2) {
return 1
}
return add(n-1) + add(n-2)
}
1. 变量必须显示声明
2. 禁用 with
3. 进制删除变量 // delete x => 语法错误
4. 禁用 fn.caller fn.arguments // 报错
5. 对象不能有重名的属性
6. 函数不能有重名的参数
7. 进制八进制表示法 02
flex-grow flex-shrink flex-basis 放大 缩小占据的空间大小
flex: 0 1 auto; // 默认
flex: 0 0 auto; // flex: none;
flex: 1 1 auto; // flex: auto;
flex: 1 1 0%; // flex: 1;
AST 抽象语法树
babel-core
通过 babylon 把 es6 解析成 AST
babel-traverse 对 ATS树进行遍历转译得到新的 AST树
babel-generator 读取 AST树并将其转换为代码和源码映射
对于新的 api、新的属性,两种处理方式
babel-polyfill 把 es6环境整体引入到代码中
regenerator-runtime、core-js
babel-plugin-transform-runtime 按需引入
babel-runtime
regenerator-runtime、core-js
babel-helpers 只引入单个,通过此插件可以把多次引入变成一个,减少代码体积
把项目看成一个整体,通过给定的主文件,webpack 从这个主文件的入口开始找到项目中的所有依赖文件,然后使用
各种 loader 转化、插件处理、文件处理,最后打包输出到一个指定的文件夹中
webpack 打包优化措施
webpack.DllPlugin 拆分固定死的依赖文件,因为不会变化所以可以预先打包好,后面直接引用
HappyPack 多进程,默认开启三个
babel-loader 开启缓存 cacheDirectory: true
exclude include
noParse: /^(vue|vue-router|vuex|vuex-router-sync|axios)$/
css 用 contenthash
hash 每次构建都会变
chunkhash .vue 文件变了就会变
contenthash 只有 css 变了才会变
function fast(arr) { // 快速排序
if (arr.length <= 1) { // 终止递归条件
return arr
}
let index = Math.floor(arr.length / 2) // 获取中间值下标
let val = arr.splice(index, 1)[0] // 删除且获取返回值
let left = []
let right = []
for (let i = 0, len = arr.length; i < len; i++) { // 数组长度已经发生变化
if (arr[i] < val) {
left.push(arr[i]) // 小的放左边
} else {
right.push(arr[i]) // 大的放右边
}
}
return fast(left).concat([val], fast(right)) // 合并数组
}
function maop(arr) { // 冒泡排序
for (let i = 0, len = arr.length; i < len - 1; i++) {
let flag = 0
for (let j = 0; j < len - i - 1; j++) {
if (arr[j] > arr[j+1]) {
let temp = arr[j]
arr[j] = arr[j+1]
arr[j+1] = temp
flag = 1
}
}
if (flag === 0) {
return arr
}
}
}
DOM结构 ;OM操作; 如何使用事件,以及IE和标准DOM事件模型之间存在的差别;怎样完整地执行一次GET请求、怎样检测错误;严格模式与混杂模式
CSS通常称为CSS样式表或层叠样式表(级联样式表),主要用于设置HTML页面中的文本内容(字体、大小、对齐方式等)、图片的外形(宽高、边框样式、边距等)以及版面的布局等外观显示样式
JavaScript一种直译式脚本语言,一种基于对象和事件驱动并具有安全性的客户端脚本语言;也是一种广泛应用客户端web开发的脚本语言。
希望能对你有启发,放心,不会太难读,在知乎上看到一个故事。平时多做复盘,思考并记录「我为什么会这么做?」「我当时的心态是什么?」这样,可以有效地帮你监测自己的思维过程,更好地控制它
css是一门功能强大、具备完整生态的复杂语言。它拥有很多的技巧, 但是生活工作中我们可能不怎么会接触到,这包括一些实际上挺实用的技巧。在此,特地列举一些css里比较容被忽略的小知识,希望能对你有所帮助。
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!