文末
从转行到现在,差不多两年的时间,虽不能和大佬相比,但也是学了很多东西。我个人在学习的过程中,习惯简单做做笔记,方便自己复习的时候能够快速理解,现在将自己的笔记分享出来,和大家共同学习。
个人将这段时间所学的知识,分为三个阶段:
第一阶段:HTML&CSS&JavaScript基础
第二阶段:移动端开发技术
第三阶段:前端常用框架
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
-
推荐学习方式:针对某个知识点,可以先简单过一下我的笔记,如果理解,那是最好,可以帮助快速解决问题;
-
大厂的面试难在,针对一个基础知识点,比如JS的事件循环机制,不会上来就问概念,而是换个角度,从题目入手,看你是否真正掌握。所以对于概念的理解真的很重要。
return a +b;
}
函数体内的语句大于一条的话,使用一个大括号将其括起来,并使用`return`语句返回。
var sum = (a, b) => { return a+b; }
由于大括号被解释为代码块,所以如果箭头函数直接返回一个对象时,必须在对象外面加一个大括号。
var getFunction = id => ({id: id, anme: “Temp”});
箭头函数也可以与变量解构结合使用:
const full = ({first, last}) => first + “” + last;
等同于
function full(person) {
return person.first +” "+ person.last;
}
使用箭头函数可以让函数表达更加简洁。
箭头函数的一个用处是简化回调函数。
[1,2,3].map(function(x){
return xx;
});
使用箭头函数的写法
[1,2,3].map(x => xx);
另一个例子
var result = values.sort(function(a, b){
return a -b;
});
箭头函数写法:
var result = values.sort((a, b) => a-b);
使用`rest`参数与箭头函数结合的例子:
const numbers = (…nums) => nums;
numbers(1,2,3,4,5,6,7,8,9); //[1,2,3,4,5,6,7,8,9]
//…nums 表示的是一个数组
const headAndTail = ( head, …tail) => [head, tail];
headAndTail(1,2,3,4,5,6,7,8,9);// [1, [2,3,4,5,6,7,8,9]]
### 二、注意事项
使用箭头函数注意以下几点:
>
> 1. 函数体内的`this`对象就是定义时所在的对象,而不是使用时所在对象;
> 2. 不可以当作构造函数使用,也就是不能用`new`命令实例化一个对象,否则会抛出一个错误;
> 3. 不可以使用`arguments`对象,该对象在函数体内不存在,如果要用的话,可以用`rest`参数代替;
> 4. 不可以使用`yield`命令,箭头函数不能用作`Generator`函数;
>
>
>
### 三、拓展阅读
* 《[Vue进阶(二十一):vue项目开发前 ES6 知识储备](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)》
### 基础学习:
前端最基础的就是 HTML , CSS 和 JavaScript 。
##### 网页设计:HTML和CSS基础知识的学习
HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息,可以包含文字、图片、视频等。
**[开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)**
![](https://img-blog.csdnimg.cn/img_convert/23c8f589732042b407bf6aa51c6b8928.webp?x-oss-process=image/format,png)
CSS样式是表现。就像网页的外衣。比如,标题字体、颜色变化,或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。
![](https://img-blog.csdnimg.cn/img_convert/03a5386c09b3e02cc7592e9af0252149.webp?x-oss-process=image/format,png)
##### 动态交互:JavaScript基础的学习
JavaScript是用来实现网页上的特效效果。如:鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻(新闻图片)的轮换。可以这么理解,有动画的,有交互的一般都是用JavaScript来实现的。
![](https://img-blog.csdnimg.cn/img_convert/0ba7a0c7fbc5e1cf82f14278d1f386f6.webp?x-oss-process=image/format,png)
511338)]
##### 动态交互:JavaScript基础的学习
JavaScript是用来实现网页上的特效效果。如:鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻(新闻图片)的轮换。可以这么理解,有动画的,有交互的一般都是用JavaScript来实现的。
[外链图片转存中...(img-kefYMG8a-1715841511338)]