前端实习面试记录 | 9.14

快给我士力架
174 阅读3分钟

游戏公司，挺基础的面试题目，大概是我答得不好，凉经

js获取DOM节点的方式

getElementById() — id选中元素
    var getid=document.getElementById('id名字')
getElementsByClassName() — 类名选中元素
    var getclass=document.getElementsByClassName('类名')
getElementsByTagName() — 标签名选中元素
    var gettag=document.getElementsByTagName('标签名')
getElementsByName() — 通过name属性获取元素
    var getname=document.getElementsByName('name名') 

   下面获取元素括号中的写法和css的选择器写法相同
querySelector() — 精准的获取某个元素 
    var f=document.querySelector("#tabelList li:nth-child(2)")
querySelectorAll()获取符合类名或者标签名等条件的的所有元素
    var g=document.querySelectorAll('.box p>span')

http和https的区别

  • http 是超文本传输协议，信息是明文传输，HTTPS 协议要比 http 协议安全，https 是具有安全性的 ssl 加密传输协议，可防止数据在传输过程中被窃取、改变，确保数据的完整性(当然这种安全性并非绝对的，对于更深入的 Web 安全问题，此处暂且不表)。
  • http 协议的默认端口为 80，https 的默认端口为 443。
  • http 的连接很简单，是无状态的。https 握手阶段比较费时，会使页面加载时间延长 50%，增加 10%~20%的耗电。
  • https 缓存不如 http 高效，会增加数据开销。
  • Https 协议需要 ca 证书，费用较高，功能越强大的证书费用越高。
  • SSL 证书需要绑定 IP，不能再同一个 IP 上绑定多个域名，IPV4 资源支持不了这种消耗。
    作者：Gaby
    链接：juejin.cn/post/701659…

怎么判断一个变量为数组

  • 使用Array.isArray 判断，如果返回 true, 说明是数组
Array.isArray(arr); // true
  • 通过原型链判断是否具有和数组同一原型链的顶端。
arr.__proto__ === Array.prototype; // true
  • 用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上
arr instanceof Array; // true
  • Object.prototype.toString.call() 所有原始数据类型都能通过该方法判断，具有通用性

判断一个后端传来数据中的对象是不是空对象

  • 将对象转换成字符串，再判断是否等于“{}”
let obj={};
console.log(JSON.stringify(obj)==="{}");
//返回true
  • for in循环
let result=function(obj){
    for(let key in obj){
        return false;//若不为空，可遍历，返回false
    }
    return true;
}
console.log(result(obj));//返回true
  • Object.keys()方法，返回对象的属性名组成的一个数组，若长度为0，则为空对象（ES6的写法）
console.log(Object.keys(obj).length==0);//返回true
// 没答出这个方法，尴尬...
  • Object.getOwnPropertyNames方法获取对象的属性名，存到数组中，若长度为0，则为空对象
console.log(Object.getOwnPropertyNames(obj).length==0);//返回true
  • jQuery中的isEmptyObject()方法，其原理是利用for in的方式来判断
console.log($.isEmptyObject(obj));//true

怎么进行对象深拷贝

  • 通过JSON.stringify() 和 JSON.parse() 将对象转为字符串之后再转为对象。
var obj = {name:'123'};
var obj2 = JSON.parse(JSON.stringify(obj))
  • 使用拓展运算符+解构赋值
    当值为undefined、function、symbol会在转换过程中被忽略。
var obj = {name:'123',age:13};
var obj2 = {...obj}
  • 使用对象的合并，即通过Object.assign()方法
    注意：该方法的第一个参数必须是空对象
var obj = {name:'123',age:13};
var obj2 = Object.assign({},obj);

从浏览器输入一个url会发生什么过程

这两篇我觉得写得都挺好的
在浏览器中输入URL后都会发生什么
浏览器输入url后经历的过程（详细）

Vue中给对象添加新属性界面不刷新?

  • Vue.set()

Vue.set( target, propertyName/index, value )

  参数
{Object | Array} target
{string | number} propertyName/index
{any} value
返回值：设置的值

通过Vue.set向响应式对象中添加一个property，并确保这个新 property 同样是响应式的，且触发视图更新

  • Object.assign()

直接使用Object.assign()添加到对象的新属性不会触发更新

应创建一个新的对象，合并原对象和混入对象的属性

this.someObject = Object.assign({},this.someObject,{newProperty1:1,newProperty2:2 …})
  • $forceUpdate

如果你发现你自己需要在 Vue 中做一次强制更新，99.9% 的情况，是你在某个地方做错了事

$forceUpdate迫使 Vue 实例重新渲染

PS：仅仅影响实例本身和插入插槽内容的子组件，而不是所有子组件。
原文链接：blog.csdn.net/m0_37343874…

JS是一门单线程语言,它的执行机制?

JS是单线程，你了解其运行机制吗？

递归解构多层对象

....

cdn

?? 一下没明白是什么

前端的性能优化

  • 减少HTTP请求，合并资源
  • 预解析DNS，减少域名数
  • 图片优化
  • 使用CDN，开启GZIP
  • JS/CSS文件优化

静态资源很多时怎么优化

  • JS/CSS压缩，减少流量
  • 多个JS/CSS组合，减少连接数
  • CDN就近访问
  • 使用小体积的图片格式

最后因为是游戏公司 会了解日常玩什么游戏

avatar
文章
阅读
粉丝