JavaScript
2021-05-04 18:14:36 0 举报AI智能生成
JavaScript读书笔记
作者其他创作
大纲/内容
数据类型
原始类型
原始类型不是对象
原始类型不能存储数据
null和undefined没有任何方法
对象包装器（包装类）
String
单引号，双引号，反引号
单引号和双引号相同
反引号可以通过${}嵌入任何表达式到字符串
反引号回车就是换行
换行符(\n)
length，字符串长度
toLowerCase() 和 toUpperCase() 方法可以改变大小写
str.indexOf（查找项，开始位置pos）
没有找到返回-1，成功返回对应的位置
字符串从0开始计算，包括开始位置pos查找
incloudes(value)
str.includes(substr, pos) 根据 str 中是否包含 substr 来返回 true/false
alert( "Midget".includes("id") ); // true
alert( "Midget".includes("id", 3) ); // false, 从位置 3 开始没有 "id"
startsWith(value)
已value开始
endsWith(value)
已value结尾
slice(start,[,end])
截取字符串，参数是开始到结束（不包括结束位置）位置
一个参数的时候，表示从当前位置开始一直到结束
let str = "stringify";
alert( str.slice(2) ); // 从第二个位置直到结束
两个参数可以为负值，表示从右往左
substring(start [, end])
截取字符串，和slice区别就是start可以大于end
不支持负数
let str = "stringify";
// 这些对于 substring 是相同的
alert( str.substring(2, 6) ); // "ring"
alert( str.substring(6, 2) ); // "ring"
substr(start [, length])
截取字符串，这里第二个参数指的是截取长度而不是位置，长度包括start位置
字符串比较
小写字母总是大于大写字母
分支主题
String.fromCodePoint(code)
通过code创建出对应的字符
str.codePointAt(pos)
实际是根据unicode编码比较，可以使用查看，pos为位置
// 不同的字母有不同的代码
alert( "z".codePointAt(0) ); // 122
alert( "Z".codePointAt(0) ); // 90
Number
四舍五入
Math.floor
向下舍入
3.1-3
-1.1-2
Math.ceil
向上舍入
3.1-4
-1.1-1
Math.round
四舍五入
3.1-3
3.6-4
-1.1--1
Math.trunc
移除小数点后的所有内容，没有舍入（IE不支持）
3.1-3
-1.1--1
toFixed(n)
四舍五入小数点后n位
如果小数比设置的值要端，则在结尾添加0
注意！损失精度的情况，6.35.Fixed(1),返回的是6.3而是不6.4,
可以看一下alert( 6.35.toFixed(20) ); // 6.34999999999999964473
可以这么做：
Math.round(6.35 * 10) / 10
isNaN(value)
将value转为数字，测试它是否为NaN
isFinite(value)
将value转为数字，判断是否为常规数字：1，2，3，而不是NaN/Infinity，字符串等
注意：空字符串或者仅用空格的字符串均被视为0,boolean值也会返回true，验证通过,还有[]空数组，null所以不建议使用这个
Object.is(value1,value2)
比较两个值是否相等
不同于==，因为==会自动类型转换，Object.is不会
不同于===，因为关于0===-0视为相等，而Object.is则视为不等
NaN在这里是等于NaN的，而==和===则不相等
parseInt和parseFloat
一般转换使用+“1”的方式就可以转成int类型的数字，但是+“1px”这种情况则会NaN，“+”的这种形式是严格的
使用parseInt('100px')
转换后：100
有读取数字的效果
注意，如果字母在前则会返回NaN，代表没有数字可读，比如parseInt('a123')
Math.random()
返回0-1随机数，不包括1
Math.max(v1,v2,v3)和Math.min()
返回最大值最小值
Math.pow(n,power)
n的power次幂
Boolean
数组
方法
push
pop
shift
unshift
splice
arr.splice(start[, deleteCount, elem1, ..., elemN])
start开始位置，deleteCount删除的个数，elem1是补充的元素
let arr = ["I", "study", "JavaScript", "right", "now"];
// remove 3 first elements and replace them with another
arr.splice(0, 3, "Let's", "dance");
返回删除后的结果
let arr = ["I", "study", "JavaScript", "right", "now"];
// 删除前两个元素
let removed = arr.splice(0, 2);
deleteCount为0，则可以当插入使用
let arr = ["I", "study", "JavaScript"];
// 从索引 2 开始
// 删除 0 个元素
// 然后插入 "complex" 和 "language"
arr.splice(2, 0, "complex", "language");
start为负数，则从数组尾部开始算
slice
arr.slice([start], [end])
返回一个新数组
start和end都可以为负数，从末尾计算索引
不包括end
从0开始计算
有个小用途，可以用于复制一个新的数组，如下：arr.slice()
concat
创建一个新数组，其中包含来自于其他数组和其他项的值。
arr.concat(arg1, arg2...)
foreach((item,index,array)=>{})
indexOf
与字符串的相同
str.indexOf（查找项，开始位置pos）
严格按照===三等号匹配
inclouds
也是按照===等号匹配
特殊：NaN查找为true，indexOf则为-1
find
特点：查找特定条件的内容
let result = arr.find(function(item, index, array) {
// 如果返回 true，则返回 item 并停止迭代
// 对于假值（falsy）的情况，则返回 undefined
});
注意：find 方法搜索的是使函数返回 true 的第一个（单个）元素，一个一个一个
arr.findIndex
返回的是索引
filter
let results = arr.filter(function(item, index, array) {
// 如果 true item 被 push 到 results，迭代继续
// 如果什么都没找到，则返回空数组
});
可以返回多个元素
map
let result = arr.map(function(item, index, array) {
// 返回新值而不是当前元素
})
一般用来转换数组用的
let lengths = ["Bilbo", "Gandalf", "Nazgul"].map(item => item.length);
alert(lengths); // 5,7,6
sort(fn)
默认是按照字符串排序
let arr = [ 1, 2, 15 ];
// 该方法重新排列 arr 的内容
arr.sort();
alert( arr ); // 1, 15, 2
可以自定义比较的函数
实际上，比较函数只需要返回一个正数表示“大于”，一个负数表示“小于”。
通过这个原理我们可以编写更短的函数：
let arr = [ 1, 2, 15 ];
arr.sort(function(a, b) { return a - b; });
alert(arr); // 1, 2, 15
reverse
颠倒数组的顺序
let arr = [1, 2, 3, 4, 5];
arr.reverse();
alert( arr ); // 5,4,3,2,1
split
let arr = names.split(', ');
给定的分隔符，进行分割
空参数也可以
let str = "test";
alert( str.split('') ); // t,e,s,t
join
let arr = ['Bilbo', 'Gandalf', 'Nazgul'];
let str = arr.join(';'); // 使用分号 ; 将数组粘合成字符串
alert( str ); // Bilbo;Gandalf;Nazgul
与split正好相反，粘合用的
reduce
像极了java里面的规约
let arr = [1, 2, 3, 4, 5];
// 删除 reduce 的初始值（没有 0）
let result = arr.reduce((sum, current) => sum + current);
alert( result ); // 15
let value = arr.reduce(function(accumulator, item, index, array) {
// ...
}, [initial]);
accumulator —— 是上一个函数调用的结果，第一次等于 initial（如果提供了 initial 的话）。
item —— 当前的数组元素。
index —— 当前索引。
arr —— 数组本身。
Array.isArray
判断是否为array数组
alert(Array.isArray([])); // true
typeof不足以支撑判断是否为array了，因为数组也是对象，返回的都是object
请注意，sort，reverse 和 splice 方法修改的是数组本身。
其他：same，every，fill，flatMap,Array.of(),不太用
遍历
数组
arr.forEach(function(item, index, array) {
// ... do something with item
});
// 遍历数组元素
for (let fruit of fruits) {
alert( fruit );
}
for (let key in arr) {
alert( arr[key] ); // Apple, Orange, Pear
}
循环会遍历 所有属性，不仅仅是这些数字属性，不建议使用
对象
for (let key in user) {
// keys
alert( key ); // name, age, isAdmin
// 属性键的值
alert( user[key] ); // John, 30, true
}
let user = {
name: "John",
age: 30
};
// 循环遍历键—值对，结合结构
for (let [key, value] of Object.entries(user)) {
alert(`${key}:${value}`); // name:John, then age:30
}
map
// 遍历所有的键（vegetables）
for (let vegetable of recipeMap.keys()) {
alert(vegetable); // cucumber, tomatoes, onion
}
// 遍历所有的值（amounts）
for (let amount of recipeMap.values()) {
alert(amount); // 500, 350, 50
}
// 遍历所有的实体 [key, value]
for (let entry of recipeMap) { // 与 recipeMap.entries() 相同
alert(entry); // cucumber,500 (and so on)
}
同时支持map，set，array，obj的遍历方式
Object.keys，values，entries
对于普通对象，下列这些方法是可用的：
Object.keys(obj) —— 返回一个包含该对象所有的键的数组。
Object.values(obj) —— 返回一个包含该对象所有的值的数组。
Object.entries(obj) —— 返回一个包含该对象所有 [key, value] 键值对的数组。
0 条评论
下一页
