前端开发 JavaScript 干货知识点汇总

news/2024/7/5 0:55:48

很多初学的朋友经常问我,前端JavaScript都需要学习哪些东西呀?哪些是JavaScript的重点知识啊?

其实做前端开发工程师,所有的知识点都是我们学习必备的东西,只有扎实的技术基础才是高薪的关键!


不过JavaScript的知识点比较多,一篇文章的内容没办法讲完。今天就来点知识点难度干货,大家来了解一下JavaScript的几个基础难点知识,给大家查漏补缺,不懂的知识可以去查一下,或者也可以私聊李老师。

理解JavaScript面向对象编程

面向对象的三大特点:继承、封装、多态

1、JS中通过prototype实现原型继承

2、JS对象可以通过对象冒充,实现多重继承

3、Object类是所有Js类的基类

4、通过function对对象进行封装

5、通过使用arguments实现参数重载

6、ES6语法糖可以直接定义类class,继承对象extends

8个JavaScript数据类型

1.基本数据类型

Undefined:代表一切未知的事物,啥都没有,无法想象,代码也就更无法去处理了。

注意:typeof(Undefined) 返回也是 Undefined。可以将Undefined赋值给任何变量或属性,但并不意味了清除了该变量,反而会因此多了一个属性。

Null:有那么一个概念,但没有东西。无中似有,有中还无。虽难以想象,但已经可以用代码来处理了。

注意:typeof(Null)返回Object,但Null并非Object,具有Null值的变量也并非object。

Boolean:布尔类型,true or false,是就是,非就非,没有疑义。对就对,错就错,绝对明确。既能被代码处理,也可以控制代码的流程。

Number:线性的事物,大小和次序分明,多而不乱。便于代码进行批量处理,也控制代码的迭代和循环等。

注意:typeof(NaN)和typeof(Infinity)都返回number 。

NaN参与任何数值计算的结构都是NaN,而且 NaN != NaN 。Infinity / Infinity = NaN 。

String:字符串类型,面向人类的理性事物,而不是机器信号。人机信息沟通,代码据此理解人的意图等等,都靠它了。

2.引用数据类型:Object、Array、Function

判断数据类型的几种方法

1、typeof

2、prototype

3、instanceof

4、constructor

5、Object.prototype.toString.call(a)

注意 : typeof null === Object

Object对象

JavaScript中所有的对象都继承自Object

constructor属性是保存当前对象的构造函数,前面的例子中,constructor保存的就是Object方法。

hasOwnProperty方法接收一个字符串参数,该参数表示属性名称,用来判断该属性是否在当前对象实例中,而不是在对象的原型链中。

isPrototype方法接收一个对象,用来判断当前对象是否在传入的参数对象的原型链上

Array数据的一些方法用法

Concat() 连接两个或更多数组

splice(index,len,[item]) 删除元素,并向数组添加一个新元素。

Slice() 从某个已有的数组返回选定的元素

Join() 把数组的所有元素放入一个字符串,元素通过指定的分隔符进行分割

push() 在数组后添加元素,并返回新的长度

unshift() 在数组最前添加元素

pop() 删除数组最后一个元素并返回该元素的值

reverse() 颠倒数组中元素的顺序

shift() 删除并返回数组中第一个元素

sort() 对数组元素进行排序

toSource() 返回该对象的源代码

toString() 把数组转换为字符串并返回结果

toLocaleString() 把数组转换为本地数组,并返回结果

valueOf() 返回对象的原始值

这些数组对象的操作方法,大家可以多翻阅开发文档来熟悉。

Function函数的理解

两种自定义函数的方法

1.function fnName(){}

2. var fnName=function(){}

函数的返回值:

1.当函数无明确返回值时,函数返回undefined。

2.有返回值返回。

函数的参数列表是可变的,数据类型也是任意数据类型,JS中有一个变量,argument可以访问所有传到函数内部的参数。

Js支持创建动态函数,动态函数必须用Function对象来定义。

JavaScript本身不支持函数的重载。如果两个方法名字一样,即使参数个数不一样,那么后面定义的就会覆盖前面定义,调用方法时永远是调用后定义的那个。

不过javascript的重载可以用别的方法来实现,之前的推文重名就会被覆盖?那JavaScript中是如何实现重载的呢?李老师很详细的讲解了2种javascript实现重载的方法,大家可以去回顾一下。

Ajax请求的原理

通过XMLHttpRequest对象来向服务器发送异步请求,从服务器获取数据。

然后用JavaScript来操作DOM而更新页面。

XMLHttpRequest是ajax的核心机制,它是IE5中首先引入的,是一种支持异步请求的技术。

简单的说,也就是JavaScript可以及时的向服务器提出请求并及时响应。而不阻塞用户。达到无刷新效果。

由事件触发,创建一个XMLHttpRequest对象,把HTTP方法 (POST/GET)和目标URL以及请求返回后的回调函数设置到XMLHttpRequest对象,通过XMLHttpRequest向服务器发送请求,请求发送后继续响应用户的界面交互,只有等到请求真正从服务器返回的时候才调用callback()函数,对响应数据进行处理。

闭包(Closure)

闭包就是能够读取其他函数内部变量的函数。

由于在JavaScript语言中,只有函数的内部的子函数才能读取局部变量,因此可以把闭包简单理解成“定义在函数内部的函数”。所以在本质上,闭包就是讲函数内部和函数外部链接起来的一座桥梁。

闭包的用途:1.获取函数内部的局部变量。2.让这些变量始终保持在内存中。

注意:

1.由于闭包会使得函数中的变量一直保存在内存中,所以不能滥用闭包,容易导致内存泄漏,影响网页性能,解决方法就是在退出函数之前,将不再使用的变量全部删除(delete);

2.闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象(object)使用,把闭包当作它的公用方法(Public Method),把内部变量当作它的私有属性(private value),这时一定要小心,不要随便改变父函数内部变量的值。

关于闭包的知识点,之前的推文《面试官问我:什么是JavaScript闭包,我该如何回答?》,李老师有非常形象化的讲解。

this的工作原理

This总是指向一个对象,具体是运行时基于函数的执行环境动态绑定的,而非函数被声明时的环境。

普通函数调用时,一般指向window对象;

对象方法调用时,指向该对象;

如果对象方法里有局部方法,里面的this会指向window对象;

在ES5模式下,this指向window的都会变成undefined;

Apply,call时,动态改变this

原型链

理解原型链的前提,首先要理解原型,之前的推文《前端开发工程师语法基础:如何理解JavaScript原型?》李老师有详细讲解,这里就不做详细讲解了。

每个JS对象都有一个prototype原型属性,指向该对象继承的原型。

原型对象上有一个 constructor 属性,该属性指向的就是构造函数。

而实例对象上有一个 __proto__ 属性,该属性也指向原型对象,并且该属性不是标准属性,不可以用在编程中,该属性用于浏览器内部使用。

原型链:其实就是有限的实例对象和原型之间组成有限链,就是用来实现共享属性和继承的。

关于原型链,之前的推文如何理解JavaScript的原型和原型链?李老师也有详细讲过了


今天的内容,主要是一个知识点汇总和前面的知识回顾,学习前端开发,需要长期的积累和持续的努力。

如果你想成为前端开发工程师,如果你现在的学习遇到了瓶颈。欢迎添加李老师的微信和老师交流。



转载于:https://juejin.im/post/5d135a21e51d45777b1a3dcc


http://www.niftyadmin.cn/n/4788552.html

相关文章

干货分享!Java 多线程编程(锁优化)

并发环境下进行编程时,需求运用锁机制来同步多线程间的操作,确保共享资源的互斥访问。 加锁会带来功能上的损坏,似乎是众所周知的事情。 然而,加锁本身不会带来多少的功能耗费,功能主要是在线程的获取锁的过程。 假…

Python Logging 模块完全解读(最全面的没有之一)

Python 中的 logging 模块可以让你跟踪代码运行时的事件,当程序崩溃时可以查看日志并且发现是什么引发了错误。Log 信息有内置的层级——调(debugging)、信息(informational)、警告(warnings)、…

使用 Theano 框架进行 MNIST 数字识别(纯干货,一点水没有)

概要:使用 Theano 机器学习框架,设计一个深度学习神经网络,对 MNIST 数据集进行手写数字识别。 (想自学习编程的小伙伴请搜索圈T社区,更多行业相关资讯更有行业相关免费视频教程。完全免费哦!) Theano 是…

Java中两变量三方法基础判断与理解

在这里首先先进行一个举例 package Text;//包名一般文件被其包裹在一个包里 public class Car { String color;//实例变量1 String paizi;//实例变量2 static int lunzi4;//静态变量 储存在指定地方。为一个类的基本信息如:车轮子4个 //构造方法不会产生返回值 如何…

一条SQL语句执行得很慢的原因到底有哪些?你不知道很有可能当误你的大事

说实话,这个问题可以涉及到 MySQL 的很多核心知识,可以扯出一大堆,就像要考你计算机网络的知识时,问你“输入URL回车之后,究竟发生了什么”一样,看看你能说出多少了。 之前腾讯面试的实话,也问…

数据结构中动态分配空间

1&#xff1a;就链式而言&#xff08;我个人比较喜欢链式因为链式缺少空间可以以加结点的形式来进行增加比较方便&#xff09; #include <iostream> #include <stdlib.h> using namespace std; void dongtaifenpei(){int *p;pnew int;&#xff08;new一个新的类型…

5个重要的人工智能预测(2019年)每个人都应该阅读

人工智能 - 特别是机器学习和深度学习 - 在2018年无处不在&#xff0c;并且预计未来12个月的炒作将不会消失。 当然&#xff0c;炒作最终会消亡&#xff0c;人工智能将成为我们生活中的另一个连贯的线索&#xff0c;就像互联网&#xff0c;电力和燃烧在过去几天一样。 但至少…

VMware 菜鸟教程

VMware下载与安装 一、 虚拟机的下载 进入VMware官网&#xff08;https://www.vmware.com/cn.html&#xff09;&#xff0c;可能会有一点慢&#xff0c;耐心等待。 点击下载&#xff0c;进入到如下页面 点击下载产品 可以看到这里有两个版本&#xff0c;windows和Linux版本&…