前端基础知识简单了解

转自:https://www.cnblogs.com/langqq/p/10484499.html
来源:前端面试常问的基础问题大全

1、es6的新特性 参考:https://www.jianshu.com/p/390a65d7a353

新增变量声明方式:let 块级作用域 const常量声明
promise
箭头函数:不需要function关键字来创建函数,可以省略return关键字,继承当前上下文的this关键字
Object.assign 浅拷贝
…扩展符号 浅拷贝 let arr = [2,3,4]; let result = […arr];
函数参数可以直接设置默认值:function(name=“xiao”){}
``反斜号模板拼接,变量用${}
结构赋值:let [a,b,c] = [1,2,3]
Set 的成员具有唯一性: let set2 = new Set([4,5,6,5])
      console.log(‘array to set 1:’, set2) =>{4, 5, 6}

Array.from([1,2,3]) // 返回和原数组一致
字符串操作
startsWith() 判断字符串是否以 XX 开头
endsWith() // 判断字符串是否以 XX 结尾
includes // let str = ‘liaoke’; str.includes(‘ao’);

2、h5的新特性

复制代码
语义标签:header footer nav aside
表单
音频 audio 视频video
canvas绘画
geolocation 定位
localstorage:长期存储数据,浏览器关闭后数据不丢失;
sessionStorage 数据在浏览器关闭后自动删除
websockt 消息推送
Drag 与Drop 拖放
复制代码

3、css3的新特性

复制代码
border-radius 圆角
box-shadow 边框阴
transform
translate
rotate
scale
flex
多媒体查询@media
动画animation
背景
background-image背景图片
background-size:cover保持横纵比与背景盒子最小大小,contain 保持横纵比缩放成适合盒子最大大小
复制代码

4、vue的生命周期

复制代码
beforeCreate:组件实例刚被创建
created:组件实例创建完成,属性已绑定,但是DOM还未生成
beforeMount:模板编译
mounted:挂载
beforeUpdate:
updated:更新
beforeDestroy:实例销毁前
destroyed:销毁
复制代码

5、vue的实现原理

vue是一个典型的MVVM框架,模型Model是js对象,修改它则视图VIEW自动更新。
vue实现双向数据绑定,需要三大模块:
Observer:能够对数据对象的所有属性进行监听,如有变动可拿到最新值并通知订阅者
Compile:对每个元素节点的指令进行扫描和解析,根据指令模板替换数据,以及绑定想要的更新函数
Watcher:作为链接Observer和Compile的桥梁,能够订阅并收到每个属性变动的通知,执行指令绑定的相应回调函数,从而更新视图。

6、原型,原型链

原型链:javaScript中的每个对象都有一个prototype属性,我们称之为原型,而原型的值也是一个对象,因此它也有自己的原型,这样就串联起来了一条原型链。原型链的链头是object,它的prototype毕竟特殊,值为null
原型链的作用是用于对象继承,函数A的原型属性(prototype property)是一个对象,当这个函数被用作构造函数来创建实例时,该函数的原型属性将被作为原型赋值给所有对象实例,比如我们新建一个数组,数组的方法便从数组的原型上继承而来。

7、面向对象

复制代码
面向对象是一种编程思想,简称OOP
面向对象的特征:封装、继承、抽象、多态
js的面向对象编程,用一句话说就是抽象,封装,继承,多态。
抽象就是把一类事物的主要特征跟问题相关的特征抽取出来,使用函数进行封装(不考虑内部实现原理,只考虑它功能使用)通过原型实现继承(通俗理解就是父母能干的事孩子也能干比如吃饭,睡觉。在JS中,比如有一个对象A,A中有一些功能,现在从A中继承出一个对象B,这个对象B就具有对象A的所有功能。)
js是弱类型语言天然具备多态的特性
复制代码

8、浏览器适配

9、安卓,ios适配

10、媒体查询

11、盒模型

12、浅拷贝与深拷贝

浅拷贝是拷贝的一层,深层次的对象级别的就拷贝引用
深拷贝是拷贝多层,每一层级的数据都会拷贝出来
13、隐式转换

14、数组去重

复制代码
function distinct(a, b) {
let arr = a.concat(b)
arr = arr.sort()
let result = [arr[0]]

for (let i=1, len=arr.length; i<len; i++) {
    arr[i] !== arr[i-1] && result.push(arr[i])
}
return result

}
// es6 new Set
function distinct(a, b) {
return Array.from(new Set([…a, …b]))
}
// 利用对象的属性不会重复这一特性,校验数组元素是否重复
function distinct(a, b) {
let arr = a.concat(b)
let result = []
let obj = {}

for (let i of arr) {
if (!obj[i]) {
result.push(i)
obj[i] = 1
}
}

return result
}

复制代码

13、数组排序

14、闭包

自执行函数也是闭包也叫做沙箱,就是让内部变量不会污染全局。
闭包的特点:可以读取函数内部变量,将函数内部变量的值始终保存在内存中,保护函数内的变量不被更改
用途:
使用闭包可以访问函数中的变量
可以使变量长期保存在内存中,生命

15、跨域以及jsonp的工作原理

概念:浏览器对于js的同源策略的限制 同源策略:同一个域名,同一个端口,相同的协议 jsonp: ajax直接请求存在跨域无权限访问的问题 凡是拥有src属性的标签都可以跨域如script img iframe jsonp的跨域请求只能是get不能是post 原理:jsonp是一种非正式的传输协议,该协议允许用户传递一个callback参数给服务器,然后服务端返回数据时会将这个callback 参数作为函数名包裹住JSON数据,这样客户端就可以随意定制自己的函数来自动处理返回数据了。

16、变量声明提升

17、事件冒泡与事件代理与事件队列

复制代码
事件冒泡:当一个元素接收到事件的时候,会把它接收到的事件传给自己的父级,一直到window.
事件代理:
 $(“div”).on(“click”,function(){})
js是单线程,任务按顺序执行,如果一个任务很耗时,下一个任务不得不等待。为了避免这种阻塞,我们需要一种非阻塞机制。这种非阻塞机制是一种异步机制,即需要等待的任务不会阻塞主执行栈中同步任务的执行。
运行机制:
所有同步任务都在主线程上执行,形成执行栈。
等待任务的回调结果进入任务队列
当主执行栈中的同步任务执行完毕后才会读取任务队列,任务队列中的异步任务会塞入主执行栈
异步任务执行完毕后再次进入下一个循环
任务队列分为:
微任务:promises
宏任务: setTimeout、setInterval等
复制代码

18、rn

19、js继承的几种方式

原型链继承
  
构造函数继承
组合继承(组合原型链与构造函数继承)
20、rem em px的区别

rem css3新增的相对单位,相对于根节点html的字体大小来计算的
em:会继承父级元素的字体大小
px:像素的相对于显示器屏幕分辨率而言的
21、vuex

state:公共状态
Getters:计算属性
Mutations: 方法
Actions:类似于mutaion,而不是直接变更状态,可以包含任意异步操作
22、js的数据类型

简单数据类型:Number String Boolean Object
引用类型:Object Array Function

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值