互联网科技让前端飞Web前端之路

怎么能学好Web前端开发?JS进阶知识点包括哪些?

2020-07-20  本文已影响0人  程序员的青春

怎么能学好Web前端开发?JS进阶知识点包括哪些?JavaScript是前端小白学习的难点,但又是前端工程师必须要掌握的技能。很多同学反映JavaScript知识点多而杂,不知道如何下手,下面就给大家盘点一下JavaScript相关的知识点。

    语言构成:

    1)基础语法(ECMAScript=ES 1、2、3、3.1、5(IE9+)、6:ES2015)/

    2)BOM:Brower Object Model 浏览器对象模型

    3)DOM(W3C):Document Object Model 文档对象模型

    变量

    变量的声明:(var关键字) 会提升到当前作用域的顶部

    JS作用域:全局作用域、局部作用域(写一个函数就产生了一个局部作用域)

    数据类型

    JavaScritp的数据类型有:数值类型、字符串类型、布尔类型、null、undefined、对象(数组、正则表达式、日期、函数)。基本数据类型:数值、字符串、布尔、null、undefined(值类型);复杂(复合)数据类型:对象(引用类型);

    使用typeof可以检测数值、字符串、布尔、undefined、函数;无法检测函数以外的对象类型以及null。

    数据类型的转换:

    Number("12ab"); //NaN

    parseInt("12.1ab"); //12

    parseFloat("12.1ab"); // 12.1

    运算符

    算术运算符:+、-、*、/、%(求余、取模)

    逻辑运算符:&&、||、!

    注意:&&:看运算符左边的数是否为真值,如果为真值,返回右边,如果为假值,返回左边;||:看运算符左边的数是否为真值,如果为真值,返回左边,如果为假值,返回右边。

    假值:空字符串""/数字0/null/undefined/false/NaN

    循环语句:for while do...while for...in

    函数声明:1)声明式函数——>函数声明提前(会提升到当前作用域的顶部);2)函数表达式(变量声明提前)。如果同时存在变量声明和函数声明,那么声明后的结果是一个函数。

    参数arguments获取实参的相关信息;函数的返回值由return 语句决定。

    异常:JS代码执行的时候出现的错误,出现错误之后,后面的代码无法执行。

    异常捕获:代码出现了异常之后,进行手动的捕捉。

    异常捕获的使用场景:一段代码可能发生错误,这个错误现在没时间解决,为了保证后面的代码可以成功执行,就进行异常捕获:try...catch。

    面向对象

    JS是一门基于对象的多泛式语言,可以使用面向过程进行开发,比如:获取元素,绑定事件、设置样式、完成动画等。

    可以使用面向对象的方式进行开发

    面向(关注于)过程:基于函数、封装函数

    面向对象:关注点变成了对象

    对象的概念:数据集、功能集

    构造函数

    为什么要有构造函数?一些对象具有相同的属性和方法(特征和行为),将他们抽象出一个同一个类型,在JS中就需要通过一个构造函数来创建这些对象,在构造函数内部设置对象的属性和方法。

    好处:一次封装,多次调用,可省略一些代码,也让代码更具有可读性。

    获取对象上的属性和方法

    1)属性:

    a.实例.属性名;

    b. 实例["属性名"];

    2)方法:

    a. 实例.方法名;

    b. 实例["方法名"];

    设置对象上的属性和方法

    1)属性:

    a. 实例.属性名=新的值;

    b. 实例["属性名"]=新的值;

    2)方法:

    a. 实例.方法名=新的值;

    b. 实例["方法名"]=新的值;

    删除原型对象中的say方法:delete

    构造函数和普通函数的区别:

    构造函数和普通函数只在调用方式不同

    1)当成普通函数来调用:

    a. 函数内部的this指向调用的对象(如果没有找到调用的对象,this指向window)

    b. 函数的返回值由return语句决定,如果没有说明函数没有返回值(返回值是undefined)

    2)当成了构造函数来调用会经历以下过程

    a. 创建一个该构造函数的实例

    b. 将构造函数内部的this的值指向该实例

    c. 执行函数体

    d. 默认的返回值:该实例

    3)函数调用的4种方式 function fn(){}

    a. 普通调用:fn();

    b. 当成构造函数调用:new fn();

    c. 被对象调用:o.fn();

    d. 上下文模式:call/apply

    4)构造函数的返回值

    a. 构造函数没有手动添加返回值,返回构造函数的实例

    b. 构造函数返回基本数据类型的值,返回的还是构造函数的实例

    c. 构造函数返回对象类型的值,返回就是那个对象

    原型对象:构造函数的prototype属性:随着实例化的次数增加,不同的对象他们拥有的say方法指向不同的内存,功能相同,造成了内存的浪费,为了解决内存,将这个方法放在某个对象(原型对象)中。

    结论1:给构造函数的prototype属性(对象)添加一个方法,这个方法就可以被构造函数的实例所共享。

    推论1:构造函数的prototype属性(对象)上面的属性、方法都可以被构造函数的实例所共享。

    推论2:Student.prototype.constructor===s1.constructor。

    结论2:构造函数的实例有一个__proto__指向的是构造函数的prototype属性(原型对象) s1.__proto__===Student.prototype

    总结:

    a.原型对象是构造函数的prototype属性;

    b.构造函数的实例的__proto__属性指向原型对象;

    c.原型对象有一个constructor属性指向构造函数本身。

我目前是在职前端开发,如果你现在也想学习前端开发技术,在入门学习前端的过程当中有遇见任何关于学习方法,学习路线,学习效率等方面的问题,你都可以申请加入我的前端学习交流裙:前面:851 中间:231 最后:348。里面聚集了一些正在自学前端的初学者裙文件里面也有我做前端技术这段时间整理的一些前端学习手册,前端面试题,前端开发工具,PDF文档书籍教程,需要的话都可以自行来获取下载。

 以上只是JavaScript知识点的一小部分,对于想要入行Web前端行业的人来说,就业是个大问题,也直接影响着各个的决定。因此,选择专业的学习比较好,不仅理论基础扎实,还有丰富的项目开发经验,有明确的职业规划和娴熟的面试技巧,为自身的快速就业提供了可能。

上一篇下一篇

猜你喜欢

热点阅读