前端面试题

Love The Way You Lie 2022-05-10 01:12 36阅读 0赞

1. 谈一谈面向对象？  
对象 = 属性 + 方法，  
面向对象基本是组合使用构造函数模式和原型模式，通过构造函数模式定义实例属性，通过原型模式定义方法和共享的属性。

2. 一个页面如何看出是html5的还是html4的？  
1、更简单的doctype声明是HTML5里众多新特征之一。现在，只需要写<!doctype html>就好了。HTML5的语法兼容HTML4和XHTML1，但不兼容SGML。简短清晰明了。  
2、html5新增加了一些元素： header（头部）、footer（底部）、menu（普通的菜单）、nav（导航链接部分）、section（内容区域块，等同于div）、article（文章内容板块，等同于div）、aside（一般用于侧边栏）、hgroup（一般用于一个标语的组合）、figure（一般表示为一个单独的元素）等等，语义的标签更利于网站的seo，同时也使项目的结构更清晰  
3、添加了新的功能媒体标记标签：audio、video这俩个标签用来嵌入音频与视频  
4、表单的全新输入类型：email、url、number、range、date pickers、search、color  
5、html5删除了一些元素：b、font、frame、center、big  
6、html5新增了一个最有特点的东西：canvas （拥有多种绘制途径、矩形、圆形、字符、以及图像的方法）  
7、h5 还新增了地理定位的功能：使用 getCurrentPosition() 方法来获得用户的位置  
8、新增了存储功能，localstrage、seeionstrage等等  
3. **数组**的深度克隆？concat  
浅度克隆：仅对一维数组克隆有效，对二维数组无效  
深层克隆：对多维数组依旧有效  
数组浅复制：slice 、concat  
数组深复制：递归函数；JSON.parse(JSON.stringify(arr)); 不可以解决数组中带有函数和函数变量；  
对象浅复制：Object.assign(\{\},obj)  
对象深复制：递归函数；JSON.parse(JSON.stringify(arr)); 不可以解决对象中带有函数和函数变量

var arr1 = [1, 2, 3, 4], arr2 = arr1.slice(0), arr3 = arr1.concat();

深层克隆：1.使用json方法

var arr1 = [1, 2, [3, 4], { a: 5, b: 6}, 7], arr2 = JSON.parse(JSON.stringify(arr1)); console.log(arr1, arr2); arr2[1] = 10; arr2[3].a = 20; console.log(arr1[1], arr2[1]); console.log(arr1[3], arr2[3]);

2.使用 jQuery 的 extend 方法

var arr1 = [1, 2, [3, 4], { a: 5, b: 6}, 7], arr2 = $.extend(true, [], arr1); console.log(arr1, arr2); arr2[1] = 10; console.log(arr1, arr2);

1.  h5音乐播放器如何兼容手机不通尺寸？
2.  js封装的一些函数？
3.  Jquery和js原生哪个用的多？
4.  this？

ele.onclick = function () { 
            setTimeout(function () { 
                alert(this);
            }, 1000);
        }

1.  事件冒泡和事件捕获？IE下的捕获？
2.  事件委托和事件源对象？
3.  集中跨域？
4.  使用jsonp是封装的还是JQuery的？
5.  除css3外的盒模型？