前端笔记

97 阅读5分钟

一、CSS3有哪些新属性

1、border-radius 圆角边框

  • 有四个参数:左上角 右上角 右下角 左下角
  • 当只有一个参数的时候四个角都是圆角
  • 当值是盒子高度的一半时则盒子呈现 胶囊形状
  • 当值是 50% 时则盒子呈现 圆形

2、box-shadow 盒子阴影

  • 有四个参数:阴影水平偏移量 阴影垂直偏移量 阴影模糊程度 阴影颜色

3、background-size 背景图片大小

  • 可以是一个或两个参数
  • 两个的话 第一个是宽度 第二个是高度 可以是px em什么的也可以是 百分比
  • 当参数是 cover 时会拉伸图片 填满div
  • 当参数时cotain 时当一个方向填满时另一个方向就会停止
  • CSS3还允许一个div放置多张背景图片
  • Eg: background-image:url(''),url('');

4、background-origin 规定背景图片的定位区域

  • 它可以设置设置背景图到底是以content、padding还是border为起点来放置背景图
  • 背景图片可以放置于content-box padding-box border-box 区域

5、text-shadow 文字阴影

  • 四个参数:阴影水平偏移量 阴影垂直偏移量 模糊程度 阴影颜色

6、transform

  • 三个参数:translate平移 rotate旋转 scale缩放

7、transition 过度

  • 三个参数: 过度名称 过渡时间 过度曲线
  • 名称:all、width、height...
  • 时间:1s、1ms...
  • 过度曲线: linear:以匀速过渡。 ease:慢速开始,中间快速,以慢速结束。 ease-in:慢速开始。 ease-out:慢速结束。 ease-in-out:以慢速开始和结束。

8、adimation 动画

  • 参数:动画名称 持续时间 运动曲线 何时开始 播放次数 是否反方向 动画起始或结束的状态,

二、git 核心概念有哪些

  • 工作区 workSpace 通过 git add 提交到暂存区
  • 暂存区 index 通过 git commit -m"" 提交到本地仓库
  • 本地仓库 Local warehouse 通过 git push 提交到远程仓库
  • 远程仓库 Remote warehouse

三、git中分支的操作有哪些

  1. git branch 查看本地分支
  2. git branch -a 查看所有分支
  3. git branch 分支名 创建本地分支
  4. git branch -D 分支名 删除本地分支
  5. git checkout 分支名 切换分支
  6. git push origin master:分支名 创建远程分支
  7. git push origin :分支名 删除远程分支
  8. git merge 分支名 合并分支

四、标准盒模型与怪异盒模型的区别

  • 标准和模型的宽高 = content 内容 -怪异和模型的宽高 = content内容 + padding内边距 + border 边框

五、event loop 事件循环如何理解

-因为JS的执行顺序的话分为 同步任务 异步任务 异步任务又分为 微任务与宏任务 -JS会先执行同步任务再执行微任务最后执行宏任务 都是先进先出

6、数组方法有哪些(写出es5的方法),什么意思

  • push 尾部添加
  • pop 尾部删除
  • unshift 头部添加
  • shift 头部删除
  • splice 对数组进行增删改
  • concat 拼接数组浅拷贝
  • reduce 数组求和浅拷贝等
  • slice 截取数组 包左不包右

7、扩展运算符与rest剩余参数是什么意思,应用场景

  • 展开运算符是将数组或对象展开成一个一个的
  • 应用场景的话可以用于合并数组 给对象添加属性等
  • rest是函数剩余形参的集合 他是一个数组
  • rest应用场景可以在当不知道有多少实参传递的时候可以使用rest剩余参数来接收 image.png

8、es6新增数据结构Set,Map代表什么意思?利用期中一种实现数组去重

  • Set 是无重复值的有序列表。根据 Object.is()方法来判断其中的值不相等,以保证无重复。 Set 会自动移除重复的值,因此你可以使用它来过滤数组中的重复值并返回结果。 Set并不是数组的子类型,所以你无法随机访问其中的值。但你可以使用has() 方法来判断某个值是否存在于 Set 中,或通过 size 属性来查看其中有多少个值。 Set 类型还拥有forEach()方法,用于处理每个值

  • Map 是有序的键值对,其中的键允许是任何类型。与 Set 相似,通过调用 Object.is()方法来判断重复的键,这意味着能将数值 5 与字符串 "5" 作为两个相对独立的键。使用set() 方法能将任何类型的值关联到某个键上,并且该值此后能用 get() 方法提取出来。Map 也拥有一个 size 属性与一个 forEach() 方法,让项目访问更容易。

e9b72f2abfd77231746da8c568271abf.png

9、说一下你理解的Promise?用promise封装一个网络请求,核心代码?

Promise 是异步编程的一种解决方案:从语法上讲,promise是一个对象,从它可以获取异步操作的消息;

从本意上讲,它是承诺,承诺它过一段时间会给你一个结果。

promise有三种状态: pending(等待态),fulfilled(成功态),rejected(失败态);状态一旦改变,就不会再变。创造promise实例后,它会立即执行

promise是用来解决两个问题的:

回调地狱,代码难以维护, 常常第一个的函数的输出是第二个函数的输入这种现象

promise可以支持多个并发的请求,获取并发请求中的数据

这个promise可以解决异步的问题,本身不能说promise是异步的 -核心代码

    let req = function () { // 封装请求可以携带的参数,例如url啥啥的,最好是以对象的形式
        // ...代码
        return new Promise((resolve, reject) => {
            // 发送请求
            if (success) { // 请求成功
                resolve(res)
            } else {
                reject(err)
            }
        })
    }
    // 发送请求
    req().then(res => {
        // 对成功后的数据做相应处理
    }).catch(err => {
        // 可以直接打印错误日志或者提示请求失败!
        console.log(err)
    })

10、说一下es6的导入导出如何使用

  • 导入:import
  • 导出:export default