学习路线

最新推荐文章于 2023-09-03 16:55:28 发布

Great pride

最新推荐文章于 2023-09-03 16:55:28 发布

阅读量137

点赞数

分类专栏：前端学习文章标签： javascript css

本文链接：https://blog.csdn.net/Great_pride/article/details/107019017

版权

3 篇文章 0 订阅

订阅专栏

阶段成果

数据交互与数据处理（跨域查询、分页加载、动态DOM解析…）

函数式开发与高级业务（运动框架、cookie封装、事件委托…）

面向对象与原型开发（插件封装基本原理、小类库开发、科里化…)

业务代码越来越熟练，我们开始接触更加深入的前端处理模型，深入原型与设计模式，通过原生开发属于自己的框架。

阶段成果

oop实战开发（jQury框架开发，swiper,AJAX封装）

实战算法与数据结构（数据映射，矩阵，去重排序…）

设计模式于ECMA开发（数据绑定，代理机制，生态链…）

一般前端的工作也分为下面的一些类型(以我找
工作时遇到的为例)

前端重构:这个主要是做-一些样式、UI之类的内容，其实就跟期末网站差不多，平时跟CSS打交道比较多，目前我知道的国内好像就只有腾讯有这
么一个职位，国外可能会更多这种明确分工的UI工程师
一般前端:主要是拿到前面UI工程师写的一些UI， (UI就是User Interface, 用户界面) ,然后实现网页的主要功能。一般跟JavaScript打交道比
较多，还要会写样式，一般公司招的也是这种前端工程师
后端工程师:前端的JavaScript其实也可以运行在后端，JavaScript在后端的名字叫Node.js,这个职位主要是用Node.js写一些中间件，具体我也不
太清楚
其他:前端的衍生技术太多了，可以用前端技术来做手机端app,可以做电脑端app,可以做小程序等等,这些技术都是基于HTML+CSS+/avaScript来的，所以也算是前端领域。

我们现在期末网站是用最基础的技术，也就是原生的HTML + CSS + JavaScript这三样技术，你应该对html和Css也有一些了解了, JavaScript可能还不太清楚,你可以简单理解为运行在浏览器的类似于c语言的东西，通过它可以做到一般编程语言做到的事情，同时也可以利用浏览器提供的一些
APIlApplication Programing Interface,程序编程接口)，来控制浏览器的一些东西( 比如调起摄像头、全屏、甚至录屏也可以做到)
我先具体讲一下JavaScript的作用，JavaScript具体分成三个部分：ecmaScript，DOM，BOM

ecmaScript是定义了这门语言的基础语法，是这门语言的核心。
比如说：
let a = ‘abbbbb’
上面这段代码定义了一个叫a的变量，然后将字符串’abbbbb’赋值给a你可以理解成定义了它的语法。

BOM，Browser Object Model，浏览器对象模型这个东西就是浏览器提供给JavaScript用来控制浏览器的一些接口，比如刚刚说的调用摄像头、录屏之类的

DOM，Document Object Model，文档对象模型
这个是非常重要的，你可以把它当成HTML与JavaScript两门语言进行交互的一个中间层

如果说一段HTML 代码是

<p id="app"><span></span></p >

那么我们就可以通过JavaScript来修改这段html：
可以通过id获取p标签

 p_element = document.getElementById('app')

然后修改p里面的内容

p_element.innerHTML = '<li></li>'

然后这段html代码就变成了：

<p id="app"><li></li></p >

然后这里出现了一个问题，刚刚修改html片段的操作本质上JavaScript通知浏览器进行更改的，所以操作会很慢所以前端工程师想出了一个办法来尽量减少操作DOM的次数：这个就是React，Vue等跨时代框架的产生这两个框架不仅帮你减少操作dom的次数，而且提供了MVVM模型的解决方法，同时使得一个网站变得更加像应用这样可以提高用户体验，使得更加像一些原生app这就是 Progressive Web App现在还可以做到离线使用
时间线回退一点，回到期末网站，我们使用的css是不是写起来特别长，而且同一个颜色要写多次然后就出现了一些处理css的工具，像scss和less
这些工具提供一些一些方面的语法，可以更加轻松地写css前端工程化就是利用一系列的工具来提高开发效率，帮你实现很多功能
比如说：你只需要修改一段代码，工程化就会帮你自动编译运行，最后浏览器自动帮你刷新展示最新的结果；
你只需要将执行一个命令，就可以直接将你现在的代码压缩、打包、然后上传到服务器上自动更新
讲完前端工程化，然后就到测试了
测试好像每种语言都有，没什么好讲的，我现在其实也不太接触到
最后讲一些前端衍生技术：

关注