22年前端面试题(零)

323 阅读5分钟

0. 在 1000 毫秒后向调用方返回字符串"OK"

1. 实现一个函数,能曾将法 [5. 1_31211的数组当作(5-(14

  • 行分组的减法运算,并返回结果。(不能使用eval,建议使用递归)

2. 要在 10 秒后调用 checkState 函数,下列哪些写法是正确的[多选]

  • setTimeout(checkState, 10)

  • setTimeout(checkState(), 10)

  • window.setTimeout(checkState,10000)

  • window.setTimeout(checkstate()

3. 关于 JavaScript 的数据类型,以下哪些说法是正确的 [多选]

  • 通过 const 声明的数组,可以向其中添加元素

  • 数组的 filter、map、sort、reverse方法都会产生新数组

  • 任意的对象都能转换为 JSON字符串

  • Number 可以表达任意大小的数字

4. 关于浏览器的限制,以下哪些说法是正确的?

  • 可以通过JS向服务器发送一个自定UDP包

  • 可以通过JS读取到用户希望上传的文件内容

  • 可以通过JS获取用户的操作系统、汶览器版本、屏幕分辨率等信息

  • 可以通过JS获取用户的收藏夹、历史记录等信息

5. 关于浏览器的存储机制,以下说法哪些是正确的? [多选)

  • 服务端可以通过HTTP请求头获取用户浏览器中 Cookie 的内容

  • localStorage 可以存储 Blob 数据□ Cookie 只能存储字符串数据,因此存储对象之前需要进行序列化

  • 除了Cookie,其他的存储机制都没有跨域限制

6. 关于网页样式和布局,以下说法哪些是正确的?[多选]

  • a(255,255,255,0) 代表的是一个不透明纯自颜色

  • 选择器不仅可以选择HTML元素,还可以选择 SVG 中的图形

  • 关于样式优先级:limport>内联样式) CSs 样式>浏览器默认样式

  • HTML元素顺序的优先级比 2-index的优先级更高

  • JPG格式的图片支持有损压缩

  • PNG 格式的图片包含图层信息,可以展示矢量图

  • SVG 格式的图片,既可以通过 img 标签使用,也可以直接复制到 HTML 中使

  • GIF 格式的图片支持透明背景

7. 浏览器的打开网页操作,可能会发生如下哪些事情,且对应描述是正确的?[多选

  • HTTP 默认端口 8080 建立 TCP 连

  • 发送 ICMP 包来判断服务器是否可连通] 通过 TCP 协议进行 DNS 解析,获取域名的 A 记录

  • 通过 NTP 服务器校准本地时间,用于TLS 证书的校验

———————————————————————————

浏览器

限制

  • 可以通过JS获取用户的操作系统、汶览器版本、屏幕分辨率等信息
  • × 可以通过JS向服务器发送一个自定UDP包
  • × 可以通过JS读取到用户希望上传的文件内容
  • × 可以通过JS获取用户的收藏夹、历史记录等信息

JavaScript 的数据类型

Number 数据类型

  • IEEE 754 64 位浮点类型
  • 使用 53 位表示小数位,10 位表示指数位,1 位表示符号位
  • 指数部分最大值为 2^10=1024
  • Number.MAX_VALUE1.7976931348623157e+308

const

  • 声明一个不可修改的常量,且必须在声明的同时初始化值
  • 可以更改对象的属性
  • 声明引用类型(Array和Object)时,保存的是其指针,即保证数组和指针不变时可以修改其中的值
    • 通过数组的索引值或者数组方法对数组进行的修改是被允许的,但是不允许对常量直接赋值
    • 对象也是同理
const arr = [1,2,3,4,5]
arr[0] = 2			// 合法
arr.push(6)			// 合法
console.log(arr)	//[2,2,3,4,5,6]
arr = [1,2,3]		// 错误
1
2
3
4
5
const obj = {name:'frank', age=18}
obj.age = 19 		// 合法
obj.weight = 100	// 合法
console.log(obj)	// {name:'frank',age=19,weight=100}
obj = {name:'lisa'}	// 错误
1
2
3
4
5

数组

数组的 sort、reverse方法都会改变原来数组,foreach用arr[index]能改变原来数组

    1. arr.reverse()
    • 颠倒数组中元素的顺序
    • 会改变原来的数组
    • 不会创建新的数组
    1. arr.filter()
    • 创建一个符合条件的所有元素的新数组
    • 不会对空数组进行检测
    • 不会改变原始数组
eg: arr.filter( (item,index,arr) => { return item>18 })
// 32,33,40
    1. arr.map()
    • 返回一个调用函数处理后的值的新数组
    • 不会对空数组进行检测
    • 不会改变原始数组
    1. arr.concat()
    • 用于连接两个或多个数组
    • 不会改变现有的数组
    • 返回被连接数组的一个副本(新数组
arrayObject.concat(arrayX,arrayX,......,arrayX)
    1. arr.sort()
    • 在原数组上对数组元素进行排序
    • 不创建新的数组
    • 不加参数是升序排序
    • 数组中的元素是数值类型
      • 需要升序排序,那么就返回a - b
      • 需要降序排序,那么就返回b - a
      • 想要降序排序,可以加参数改变
let arr = ['a', 'b', 'd', 'c'];
arr.sort(function (a, b) {
	if(a > b){
		return -1;
	}else if(b > a){
		return 1;
	}else{
		return 0;
	}
});
1
2
3
4
5
6
7
8
9
10
let arr = [1, 5, 3, 7, 6];
arr.sort(function (a, b) {
	return a - b;
});
1
2
3
4
  • 以数组中字符串长度进行排序
let arr = ['1234', '56', '23980', '234', '7'];
arr.sort(function (a, b) {
	return a.length - b.length;
});
1
2
3
4
  • 数组中的对象中的某个属性值排序
let arr = [{name: 'ww', age: 12},{name: 'gg', age: 8},{name: 'uu', age: 69}];
arr.sort(function (a, b) {
	return a.age - b.age;
});
    1. arr.forEach(item, index, arr)
    • 调用数组的每个元素,并将元素传递给回调函数
    • 对于空数组不会执行回调函数
    • 直接用item=xxx是无法改变原数组
    • 用arr[index]就可以改变原数组
var s = [1,2,3,4];
s.forEach(item=>{
   item = 'a'
});
console.log(s);// ["1", "2", "3", "4"] 未改变原数组


s.forEach((item, index, arr)=>{
   arr[index] = 'b'
});
console.log(s);// ["b", "b", "b", "b"] 改变了原数组
  • 数组里面的子元素是对象,那么是可以改变对应属性的
var s = [{a:1}, {a:1}];
s.forEach(item=>{
    item = null;
});
console.log(s);//[{a: 1} ,{a: 1}] 未改变原数组
 
s.forEach(item=>{
    item.a = 666;
});
console.log(s); // [{a: 666}, {a: 666}] //改变的原数组里面的对象属性
eg: arr List.forEach(item => {
item. product = Arr_PRODUCT_LIST.filter(product => +product. price == item. amount /item. quantity ). pop () || {};
item. statusItem = this . statusColorBox [item.status]
console . log (item);
});