<!DOCTYPE html>
<html>
<head>
<title>面试题</title>
<style type="text/css">
.item {
margin: 10px;
padding: 20px;
background: #e0e0e0;
}
.btn {
margin: 20px 0;
padding: 5px 20px;
color: #fff;
cursor: pointer;
border-radius: 0 4px 4px 0;
background-color: #2F94F8;
</style>
</head>
<body>
<h1>前端js面试题</h1>
<div class="item">
<div>
<h3>1、数组去重并排序</h3>
</div>
<div>
<span>输入：let inputs = ['c', 'a', 'b', 'a'];</span>
</div>
<button onclick="removalAndSort()" class="btn">执行（F12 查看）</button>
</div>
<div class="item">
<div>
<h3>2、对象转换</h3>
</div>
<div><span>输入：let input = "Prod_id,prod_Name,prod_dEsc"</span></div>
<button onclick="ObjectToChange()" class="btn">执行（F12 查看）</button>
</div>
<div class="item">
<div>
<h3>3、二维数组转换成树结构</h3>
</div>
<div><span>输入：let input = [
["新闻", "体育", "网球", "国外"],
["新闻", "体育", "网球", "国内"],
["产品", "互联网", "金融"],
["新闻", "房产", "深圳"],
["新闻", "房产", "上海"],
["新闻", "体育", "羽毛球"],
["产品", "互联网", "保险"]
]</span></div>
<button onclick="arrToTree()" class="btn">执行（F12 查看）</button>
</div>
<div class="item">
<div>
<h3>4、坐标计算 圆心o 半径r 圆弧n等分，取得坐标数组</h3>
</div>
<div><span>输入：let input = {
o: [100, 100],
r: 100,
n: 5
}</span></div>
<button onclick="computeCoordinate()" class="btn">执行（F12 查看）</button>
</div>
<div class="item">
<div>
<h3>5、根据单词表切分单词</h3>
</div>
<div><span>输入：let words=['my','home','welcome','this'] <br/>
let input="hellothisismyhomewelcometomyhome"
</span></div>
<button onclick="splitWord()" class="btn">执行（F12 查看）</button>
</div>
<script type="text/javascript">
window.onload = function (argument) {
console.log(333)
}
function removalAndSort () {
let inputs = ['c', 'a', 'b', 'a'];
let inputs2 = [...new Set(inputs)];
console.log(inputs2.sort());
}
function ObjectToChange () {
let input = "Prod_id,prod_Name,prod_dEsc"
let new_input = input.split(',')
let output = []
for (let i = 0; i < new_input.length; i++) {
let e = new_input[i];
let lower_e = e.toLowerCase();
let lower_e_index = lower_e.indexOf('_')
let common = lower_e.substr(0, lower_e_index) + lower_e.slice(lower_e_index, lower_e_index + 2).toUpperCase() + lower_e.substr(lower_e_index + 2);
let key = common.replace('_', '');
let centerLabel = common.replace('_', ' ')
let label = centerLabel[0].toUpperCase() + centerLabel.slice(1);
let item = {
key,
label,
index: i + 1
}
output.push(item)
}
console.log(output)
}
function arrToTree () {
let input = [
["新闻", "体育", "网球", "国外"],
["新闻", "体育", "网球", "国内"],
["产品", "互联网", "金融"],
["新闻", "房产", "深圳"],
["新闻", "房产", "上海"],
["新闻", "体育", "羽毛球"],
["产品", "互联网", "保险"]
];
let output1 = [];
for (let i = 0; i < input.length; i++) {
let e_arr = input[i];
for (let j = 0; j < e_arr.length; j++) {
let pre = e_arr[j - 1] || ''
let e = e_arr[j];
let temp = {
name: e,
pre_name: pre,
};
let hasObj = output1.findIndex((val, index, arr) => {
return val.name == temp.name && val.pre_name == temp.pre_name;
})
if (hasObj == -1) {
output1.push(temp);
}
}
}
let treeMapList = output1.reduce((arr, cur) => {
arr[cur['name']] = cur;
return arr;
}, {})
let result = output1.reduce((arr, cur) => {
let pre_name = cur.pre_name;
let parent = treeMapList[pre_name];
if (parent) {
parent.children? parent.children.push(cur): parent.children = [cur];
} else if (pre_name == '') {
arr.push(cur);
}
return arr;
}, [])
console.log('result--->', result)
}
function computeCoordinate() {
let input = {
o: [100, 100],
r: 100,
n: 5
}
let n_rad = 360 / input.n * (Math.PI / 180);
let results = [];
for (let i = 0; i < input.n; i++) {
let item_rad = n_rad * i;
let n_x = Math.cos(item_rad) * input.r + input.o[0];
let n_y = Math.sin(item_rad) * input.r + input.o[1];
results.push([n_x, n_y]);
}
console.log('results', results);
}
function splitWord() {
let words=['my','home','welcome','this']
let input="hellothisismyhomewelcometomyhome"
for (let i = 0; i < words.length; i++) {
let e = words[i];
let re = new RegExp(e, 'g');
input = input.replace(re, '_' + e + '_');
}
let reg = /(_){2}/g;
let twoInsert = input.match(reg);
if (twoInsert.length > 0) {
input = input.replace(/__/g, '_');
}
input = input.replace(/^_|_$/g, "");
let results = input.split('_');
console.log(results)
}
</script>
</body>
</html>
