前端基础能力整理

----------克隆远程库项目-----------

1.新建文件夹，克隆项目：git clone 远程库http地址 （此处需要登入公司getlab）

2.新建本地分支：git checkout -b 分支名

3.切换分支：git checkout 分支名

4.切换镜像源：nrm use ...

5.初始化依赖包：npm i

6.运行项目 npm run dev

 

 

 

 

 

 

------技术技巧-------

 

 

1.Object.assign({},acitonsA,actionsB,....)

解释：Object.assign(A,B,C)---把C对象中B对象没有的属性赋给B对象，再把B对象中A对象没有的属性赋给A对象，最后返回被修改的A对象，即A对象包含BC对象 。

 

2.数组中有很多数据，传入一个num，按num对数组进行分组

function groupByNum( { num = 4, list=[] } = {} ){
    const groupList=[]
    for( let i = 0; i < list.length; i += num ){
        groupList.push(list.slice(i, i + num))
    }
    return groupList
}

 

3.路由重定向

{
        path: '*', // 当路由找不到对应组件时，转到transit
        redirect: '/transit' // 自定义平台模块名称
    }

|

|---a页面

|---b页面

|---c页面

 

history模式：

history.pushState() a->b->a

1.建立的页面保持同一目录下，在a页面中点击按钮触发函数

2.函数调用window.history.pushState(),传入参数进行跳转

pushState(AA,'',BB),需要三个参数

第一个参数AA是一个对象，可通过history.state访问到

第二个参数由于历史原因设置为 ''

第三个参数BB是跳转的页面

3.函数生效后url路径变更，但是不渲染页面，此时点击刷新可渲染页面

4.此函数可跳转页面，保存历史记录，此时返回会回到a页面

 

history.replaceState() a->b->c->a

1.建立的页面保持同一目录下，在b页面中点击按钮触发函数

2.函数调用window.history.replaceState(),传入参数进行跳转

replaceState(AA,'',BB),需要三个参数

第一个参数AA是一个对象，可通过history.state访问到

第二个参数由于历史原因设置为 ''

第三个参数BB是跳转的页面

3.函数生效后url路径变更，但是不渲染页面，此时点击刷新可渲染页面

4.此函数亦可跳转页面，但是不保存历史记录，此时返回直接回到a页面，没有b页面的记录

 

4.动态引入同级目录下的以.js结尾的文件

require.context()