0、数组和字符串相互转换
字符串转数组：
const array = str.split(','); //关于split: 可以接收第二个参数，表示返回数组的最大长度
数组转字符串：
const str = array.toString(); const str = array.join('='); //可以指定连接符。如果省略参数，将使用逗号作为分隔符
toString() 和 join()区别：
const elements = ['Fire', 'Air', 'Water']; console.log(elements.join()); //默认用逗号隔开 // expected output: "Fire,Air,Water" console.log(elements.join('')); // expected output: "FireAirWater" console.log(elements.join('-')); // expected output: "Fire-Air-Water"
每个对象都有一个 toString() 方法.
let x; console.log(x.toString()); //Error: Cannot read property 'toString' of undefined
var o = new Object();
o.toString(); // [object Object]1. 对数组调用map方法
Array.prototype.map()的功能：对原数组中的每个元素调用指定的方法（不会修改原数组），将每个返回值组合成新的数组
当时犯的傻：以为是对原数组进行修改，所以没有定义一个变量接收新的数组。
规范写法：（引用自MDN文档）
const array1 = [1, 4, 9, 16]; // pass a function to map const map1 = array1.map(x => x * 2); console.log(map1); // expected output: Array [2, 8, 18, 32]
补充知识：不能用它来进行筛选，筛选的话要用filter()
2. antd dataIndex 嵌套字段
dataIndex 如果是嵌套的，需要用 String 数组 ['columns','id'] 而不是 columns.id
比如你想要将后端返回的数据显示在table中，但是数据格式如下：
result:{ id:'001', //可以直接取到 columns:{ columnId:'837542934', //需要通过数组 columnName:'address' } }
那么在写代码的时候就要写成：
const tableCol=[ { title:'列ID', dataIndex:['columns','columnId'], render:(text)=>{<a onClick={()=>console.log(text)}></a>} //这里的text就会对应columns中的columnId } ]
数组形式是antd v4才提出的，参考antd官方文档：https://ant.design/docs/react/migration-v4-cn#%E7%BB%84%E4%BB%B6%E9%87%8D%E6%9E%84
3. antd 中，Select 组件如何取到 label 的值
<Select keyValue='id' labelValue='name' data={dataSource} labelInValue />
const [form] = Form.useForm();
const {setFieldsValue} = from;
useEffect(()=>{
const {id,name}= record; setFieldsValue({
selectData: {key: id, label:name}
}); },[]);
4. Object.keys()怎么用
Object.keys()返回对象自身的（可枚举）属性构成的数组。
补充：for in也可以遍历对象上的属性，不同的是它还会遍历原型链上的属性
4.1 判断对象是否为空：
const a={key:'1'};
const doSomething=(a)=>{
const arr = Object.keys(a);
if(arr.length>0){
console.log('对象不为空');
}
};
4.2 处理数组，返回索引值数组
const s = [111,222,333,444,555,666]; console.log(Object.keys(s)); //[ '0', '1', '2', '3', '4', '5' ]
4.3 遍历对象，取到每个属性的值
const obj = {id:'001', name:'Emma', age:'19', address:'britain'};
Object.keys(obj).map(item=>{
console.log(item, obj[item])
});
打印出来的结果：
//id 001 //name Emma //age 19 //address britain
4.4 判断是否是对象的自身属性
let obj={name:'jack'} ;
console.log(obj.hasOwnProperty('name')); //true
补充：Object.values()，它的返回值：
一个包含对象自身的所有可枚举属性值的数组。
5. null ，undefined 和 NaN
null的定义: a null value represents a reference that points to a nonexistent or invalid object or address.
typeof null === 'object' // true
undefined: 当你声明一个变量但没有声明它的值时，JavaScript会给它赋值undefined
NaN:表示一个不是数字的东西，尽管它实际上是一个数字。 //typeof NaN -> number NaN 与任何值（包括其自身）相比得到的结果均是 false. 所以要判断某个值是否是 NaN，不能使用 == 或 === 运算符,要用 isNaN(result)
6. indexOf()
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。
对大小写敏感。
如果要检索的字符串值没有出现，则该方法返回 -1。
stringObject.indexOf(searchvalue,fromindex)
//fromindex: 规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1
7.toLocalString()
可以将数字变成千分位格式：
var number = 3500; console.log(number.toLocaleString()); //3,500
把Date对象转化成字符串：
var date = new Date();
var str=d.toLocaleString(); console.log(str);
VM224:1 2020/9/28 上午9:53:29
8. margin padding 分别带不同个数的参数
margin: 20px 40px; //（上、下20px；左、右40px。） margin: 20px 40px 60px; //（上20px；左、右40px；下60px。） margin: 20px 40px 60px 80px; //（上20px；右40px；下60px；左80px。）
9. 将变量作为key取出对象的属性值
场景:从对象中找到某个变量对应的值
const obj={title:'book 1'};
const myFunc=(val)=>{
// let result = obj.val; //不能这样写，js会去取obj的val属性，结果是undefined
let result = obj[val]; //正确，打印结果："book 1"
console.log(result)
};
myFunc('title');
10. Math.max() 的用法
MDN文档：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Math/max
//注意参数格式。之前我以为是传个数组进去就行了，结果返回的是NaN console.log(Math.max(1, 3, 2)); // expected output: 3 console.log(Math.max(-1, -3, -2)); // expected output: -1 const array1 = [1, 3, 2]; console.log(Math.max(...array1)); // expected output: 3
11.使用filter()和indexOf()去掉数组中的重复数据
const func = (val)=>{ if(typeof val === 'string') {arr = val.split('');} else{ arr = val} const result = arr.filter( (item,index)=>{ return arr.indexOf(item)===index; //过滤条件：当前的位置就是第一次出现的位置 }); return result; } console.log(func('AAAAAWWWREFSSSS')) //> Array ["A", "W", "R", "E", "F", "S"]
12.选出数组中那个“与众不同”的元素
题目来源：https://www.codewars.com/kata/585d7d5adb20cf33cb000235/train/javascript
There is an array with some numbers. All numbers are equal except for one. Try to find it!
findUniq([ 1, 1, 1, 2, 1, 1 ]) === 2 findUniq([ 0, 0, 0.55, 0, 0 ]) === 0.55
我的答案：
function findUniq(arr) { let newArr=arr.filter((item)=>{ return arr.indexOf(item)!==0; 如果unique number是arr[0]，数组长度是arr.length-1，如果不是，数组长度为1 }); if(newArr.length>1){ return arr[0]；} 如果数组长度大于1，就说明原数组第一个数就是unique number else{ return newArr[0]； } };
其他人的解答：
function findUniq(arr) { return arr.find(n => arr.indexOf(n) === arr.lastIndexOf(n)); }
lastIndexOf()
引用：https://www.w3school.com.cn/jsref/jsref_lastIndexOf.asp
lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置
lastIndexOf() 方法对大小写敏感
如果要检索的字符串值没有出现，则该方法返回 -1
stringObject.lastIndexOf(searchvalue,fromindex)
//fromindex:规定在字符串中开始检索的位置。如省略该参数，则将从字符串的最后一个字符处开始检索
补充：indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置
13.进制转换
Number.toString(radix)
var count = 10;
console.log(count.toString()); // 输出 '10'
console.log((17).toString()); // 输出 '17'
console.log((17.2).toString()); // 输出 '17.2'
var x = 6;
console.log(x.toString(2)); // 输出 '110'
console.log((254).toString(16)); // 输出 'fe'
console.log((-10).toString(2)); // 输出 '-1010'
console.log((-0xff).toString(2)); // 输出 '-11111111'parseInt(string, radix)
引用：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/parseInt
解析一个字符串并返回指定基数的十进制整数， radix 是2-36之间的整数，表示被解析字符串的基数。
参数
string- 要被解析的值。如果参数不是一个字符串，则将其转换为字符串(使用
ToString抽象操作)。字符串开头的空白符将会被忽略。
radix可选- 从
2到36，表示字符串的基数。例如指定 16 表示被解析值是十六进制数。请注意，10不是默认值！
14.填充字符串，使其达到目标长度:padStart() padEnd()
引用：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String/padStart
padStart()
str.padStart(targetLength [, padString])
const str1 = '5'; console.log(str1.padStart(2, '0')); // expected output: "05" const fullNumber = '2034399002125581'; const last4Digits = fullNumber.slice(-4); const maskedNumber = last4Digits.padStart(fullNumber.length, '*'); console.log(maskedNumber); // expected output: "************5581"
padEnd()
str.padEnd(targetLength [, padString])
const str1 = 'Breaded Mushrooms'; console.log(str1.padEnd(25, '.')); // expected output: "Breaded Mushrooms........" const str2 = '200'; console.log(str2.padEnd(5)); // expected output: "200 "
实战：
RGB To Hex Conversion
题目来源：https://www.codewars.com/kata/513e08acc600c94f01000001/train/javascript
The rgb function is incomplete. Complete it so that passing in RGB decimal values will result in a hexadecimal representation being returned. Valid decimal values for RGB are 0 - 255. Any values that fall out of that range must be rounded to the closest valid value.
Note: Your answer should always be 6 characters long, the shorthand with 3 will not work here.
The following are examples of expected output values:
rgb(255, 255, 255) // returns FFFFFF rgb(255, 255, 300) // returns FFFFFF rgb(0,0,0) // returns 000000 rgb(148, 0, 211) // returns 9400D3
我的答案：
function rgb(r, g, b){
const arr = Object.values(arguments);
const result = arr.map((item)=>{
if(item<0)return '00';
if(item>255)return 'FF';
return item.toString(16).toUpperCase().padStart(2,'0');
});
return result.join('');
}TO BE CONTINUED