js基础
1)对js的理解?
2)请说出以下代码输出的值?
3)把以下代码,改写成依次输出0-9
4)如何区分数组对象,普通对象,函数对象
5)面向对象、面向过程
6)面向对象的三大基本特性
7)XML和JSON的区别?
8)Web Worker 和webSocket?
9)Javascript垃圾回收方法?
10)new操作符具体干了什么呢?
11)js延迟加载的方式有哪些?
12)WEB应用从服务器主动推送Data到客户端有那些方式?
绵阳: [104.73, 31.48],
乌鲁木齐: [87.68, 43.77],
枣庄: [117.57, 34.86],
杭州: [120.19, 30.26],
淄博: [118.05, 36.78],
鞍山: [122.85, 41.12],
溧阳: [119.48, 31.43],
库尔勒: [86.06, 41.68],
安阳: [114.35, 36.1],
开封: [114.35, 34.79],
济南: [117, 36.65],
德阳: [104.37, 31.13],
温州: [120.65, 28.01],
九江: [115.97, 29.71],
邯郸: [114.47, 36.6],
临安: [119.72, 30.23],
兰州: [103.73, 36.03],
沧州: [116.83, 38.33],
临沂: [118.35, 35.05],
南充: [106.110698, 30.837793],
天津: [117.2, 39.13],
富阳: [119.95, 30.07],
泰安: [117.13, 36.18],
诸暨: [120.23, 29.71],
郑州: [113.65, 34.76],
哈尔滨: [126.63, 45.75],
聊城: [115.97, 36.45],
芜湖: [118.38, 31.33],
唐山: [118.02, 39.63],
平顶山: [113.29, 33.75],
邢台: [114.48, 37.05],
德州: [116.29, 37.45],
济宁: [116.59, 35.38],
荆州: [112.239741, 30.335165],
宜昌: [111.3, 30.7],
义乌: [120.06, 29.32],
丽水: [119.92, 28.45],
洛阳: [112.44, 34.7],
秦皇岛: [119.57, 39.95],
株洲: [113.16, 27.83],
石家庄: [114.48, 38.03],
莱芜: [117.67, 36.19],
常德: [111.69, 29.05],
保定: [115.48, 38.85],
湘潭: [112.91, 27.87],
金华: [119.64, 29.12],
岳阳: [113.09, 29.37],
长沙: [113, 28.21],
衢州: [118.88, 28.97],
廊坊: [116.7, 39.53],
菏泽: [115.480656, 35.23375],
合肥: [117.27, 31.86],
武汉: [114.31, 30.52],
大庆: [125.03, 46.58],
};
var res = [];
for (var i = 0; i < data.length; i++) {
var geoCoord = geoCoordMap[data[i].name];
if (geoCoord) {
res.push({
name: data[i].name,
value: geoCoord.concat(data[i].value),
});
}
}
console.log(res);
return res;
},
initMap(name) {
echarts.registerMap(name, data); // 注册矢量地图数据
let map = echarts.init(this.$refs.chinaMap);
let option = {
title: {
text: '测试bar3D、scatter3D、geo3D',
x: 'left',
top: '10',
textStyle: {
color: '#000',
fontSize: 14,
},
},
grid: {
y: 200,
x: 100,
},
tooltip: {
show: true,
},
visualMap: [
{
type: 'continuous',
seriesIndex: 0,
text: ['bar3D'],
calculable: true,
max: 300,
inRange: {
color: ['#87aa66', '#eba438', '#d94d4c'],
},
},
{
type: 'continuous',
seriesIndex: 1,
text: ['scatter3D'],
left: 'right',
max: 100,
calculable: true,
inRange: {
color: ['#000', 'blue', 'purple'],
},
},
],
geo3D: {
map: 'china',
roam: true,
itemStyle: {
color: '#eee',
opacity: 1,
borderWidth: 0.4,
borderColor: '#000',
},
viewControl: {
beta: 0, //x轴旋转
alpha: 70, //Y轴旋转
panMouseButton: 'center', //平移操作使用的鼠标按键
rotateMouseButton: 'left', //旋转操作使用的鼠标按键
},
label: {
show: true,
textStyle: {
color: '#f90', //地图初始化区域字体颜色
fontSize: 12,
opacity: 1,
backgroundColor: '#f90',
},
},
emphasis: {
//当鼠标放上去 地区区域是否显示名称
label: {
show: true,
textStyle: {
color: '#fff',
fontSize: 3,
backgroundColor: 'red',
},
},
},
light: {
//光照阴影
main: {
color: '#fff', //光照颜色
intensity: 1.2, //光照强度
shadowQuality: 'high', //阴影亮度
shadow: false, //是否显示阴影
alpha: 55,
beta: 10,
},
ambient: {
intensity: 0.3,
},
},
},
series: [
{
name: 'bar3D',
type: 'bar3D',
coordinateSystem: 'geo3D',
barSize: 0.5, //柱子粗细
shading: 'lambert',
opacity: 1,
color: 'red',
bevelSize: 0,
label: {
show: true,
formatter: '{b}',
},
data: this.convertData([
{
name: '海门',
value: 100,
},
{
name: '鄂尔多斯',
value: 200,
},
{
name: '招远',
value: 300,
},
{
name: '舟山',
value: 200,
},
{
name: '济南',
value: 200,
},
{
name: '乌鲁木齐',
value: 200,
},
{
name: '宜宾',
value: 200,
},
{
name: '西宁',
value: 200,
},
]),
},
{
name: 'scatter3D',
type: 'scatter3D',
coordinateSystem: 'geo3D',
symbol: 'pin',
color: 'red',
symbolSize: 30,
opacity: 0,
label: {
show: true,
formatter: '{b}',
},
itemStyle: {
borderWidth: 1,
borderColor: '#fff',
},
data: this.convertData([
{
name: '阳泉',
value: 200,
},
{
name: '莱州',
value: 200,
},
{
name: '湖州',
value: 200,
},
{
name: '汕头',
value: 200,
},
{
name: '昆山',
value: 200,
},
{
name: '张家口',
value: 200,
},
]),
},
],
};
map.setOption(option, true);
},
},
};
![在这里插入图片描述](https://img-blog.csdnimg.cn/cdb819b096b849b5b48e5dd053c48434.png)
背景颜色是`echarts`外层的`div`的`background`来控制的,改成白色,更显眼一点。
基本布局完成!!!
## 6.`geo3D地图禁止缩放+旋转`
options = {
geo3D: {
map: ‘china’,
roam: true,
silent: true, //禁止鼠标移入某个区域后高亮显示
itemStyle: {
color: ‘#333’,
opacity: 1,
borderWidth: 0.4,
borderColor: ‘#fff’,
},
viewControl: {
beta: 0, //x轴旋转
alpha: 60, //Y轴旋转
panMouseButton: ‘center’, //平移操作使用的鼠标按键
rotateMouseButton: ‘left’, //旋转操作使用的鼠标按键
rotateSensitivity: 0, //禁止旋转地图
//下面的四个参数 可以实现禁止缩放地图
projection: ‘orthographic’,
orthographicSize: 110,
maxOrthographicSize: 110,
minOrthographicSize: 110,
},
},
}
修改的参数是`options`中的`geo3D`中的`viewControl`参数。
### 6.1 禁止旋转地图
rotateSensitivity: 0, //禁止旋转地图
### 6.2 禁止缩放地图
//下面的四个参数 可以实现禁止缩放地图
projection: ‘orthographic’,
orthographicSize: 110,
maxOrthographicSize: 110,
minOrthographicSize: 110,
### 6.3 设置透明背景的地图
options = {
geo3D: {
map: ‘china’,
roam: true,
silent: true, //禁止鼠标移入某个区域后高亮显示
itemStyle: {
color: ‘transparent’,
opacity: 1,
borderWidth: 0.4,
borderColor: ‘#fff’,
},
}
}
- 可以设置itemStyle中的color:为transparent,来设置背景透明
- opacity:设置为0,也可以实现背景透明化
- borderWidth:设置边框宽度
- borderColor:设置边框颜色
### 6.4 鼠标移入时,禁止高亮展示当前区域——`silent: true`
options = {
geo3D: {
map: ‘china’,
roam: true,
silent: true, //禁止鼠标移入某个区域后高亮显示
}
}
### 6.5 设置`bar3D`柱子的颜色
### `设置柱子颜色,需要把visualMap中的内容注释掉,然后在series中的bar3D中设置color才生效!!!`
多多积累,多多收货!!!
附录参考链接:
[echarts实现3D地图:http://www.javashuo.com/article/p-fcfpjabz-gh.html](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)
**ES6**
* 列举常用的ES6特性:
* 箭头函数需要注意哪些地方?
* let、const、var
* 拓展:var方式定义的变量有什么样的bug?
* Set数据结构
* 拓展:数组去重的方法
* 箭头函数this的指向。
* 手写ES6 class继承。
**[开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**
![](https://img-blog.csdnimg.cn/img_convert/aac1740e50faadb9a6a7a5b97f9ccba8.png)
**微信小程序**
* 简单描述一下微信小程序的相关文件类型?
* 你是怎么封装微信小程序的数据请求?
* 有哪些参数传值的方法?
* 你使用过哪些方法,来提高微信小程序的应用速度?
* 小程序和原生App哪个好?
* 简述微信小程序原理?
* 分析微信小程序的优劣势
* 怎么解决小程序的异步请求问题?
![](https://img-blog.csdnimg.cn/img_convert/60b1dbe5c76e264468aa993416a9a031.png)
**其他知识点面试**
* webpack的原理
* webpack的loader和plugin的区别?
* 怎么使用webpack对项目进行优化?
* 防抖、节流
* 浏览器的缓存机制
* 描述一下二叉树, 并说明二叉树的几种遍历方式?
* 项目类问题
* 笔试编程题:
![](https://img-blog.csdnimg.cn/img_convert/aec12fc95e5722b9f2f1f22eeb5e67bd.png)
#### 最后
技术栈比较搭,基本用过的东西都是一模一样的。快手终面喜欢问智力题,校招也是终面问智力题,大家要准备一下一些经典智力题。如果排列组合、概率论这些基础忘了,建议回去补一下。
怎么解决小程序的异步请求问题?
![](https://img-blog.csdnimg.cn/img_convert/60b1dbe5c76e264468aa993416a9a031.png)
**其他知识点面试**
* webpack的原理
* webpack的loader和plugin的区别?
* 怎么使用webpack对项目进行优化?
* 防抖、节流
* 浏览器的缓存机制
* 描述一下二叉树, 并说明二叉树的几种遍历方式?
* 项目类问题
* 笔试编程题:
![](https://img-blog.csdnimg.cn/img_convert/aec12fc95e5722b9f2f1f22eeb5e67bd.png)
#### 最后
技术栈比较搭,基本用过的东西都是一模一样的。快手终面喜欢问智力题,校招也是终面问智力题,大家要准备一下一些经典智力题。如果排列组合、概率论这些基础忘了,建议回去补一下。