js必掌握的知识点

2022-07-24,

js阶段走完,今天刚好有空闲时间,对js所在阶段我认为比较重要的知识点进行总结,希望看到的小伙伴对你有所帮助。

一.闭包

官方对闭包的解释:一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量便也是该表达式的一部分。
简单来说,JavaScript允许使用内部函数–即函数定义和函数表达是是位于另一个函数的函数体内。而且,这些内部函数可以访问它们所在外部函数中声明的局部变量,参数和声明的其他内部函数。当其中一个这样的内部函数在包含他们的外部函数之外被调用时,就形成闭包。
闭包是一种保护私有变量的机制,在函数执行时形成的私有的作用域,保护里面的私有变量不受外界干扰。直观的说就是形成一个不销毁的栈环境。
闭包的典型demo:

...
<P id="demo">0<p> 
<script>
var add=(function(){
var counter =0;
return function(){return counter+=1;}
})();
function myfunction(){
document.getElementid("demo").innerHTML=add();
}
</script>

二.作用域

作用域对js的学习一直来说都是一个不小的挑战,我今天来谈谈我对js的理解。
1.在java中是存在块级作用域,即:大括号也是一个作用域。

public static void main(){
if(1==1){
String name="seven";
}
System.out.println(name);
//报错
}

而JavaScript语言中无块级作用域

function Main(){
if(1==1)
{
var name="seven";
}
console.log(name);
}
//输出:seven

补充:JavaScript6中引入了let关键词,用于指定变量属于块级作用域,在下面部分我会着重的说一下“let”和“var”
2.在JavaScript中每一个函数作为一个作用域,在外部是无法访问到内部作用域的变量。

function Main(){
var inner='seven';
}
Main();
console.log(inner);
//报错

3.如果出现作用域链,那么寻找变量时就会出现顺序,其寻找顺序为根据作用域链从内到外的优先级寻找,如果内部没有就逐步向上找,直到没有抛出异常。
经典案例:

a='one';
function Fun(){
var a='two';
function inner(){
var a='three'
console.log(a);
}
inner();
}

三.this

解析器在调用函数每次都会向函数内部传递一个隐含的参数,这个隐含的参数就是this,this指向的时一个对象。
这个对象指的时上下文对象,即根据函数调用方法的不同,this会指向不同的对象

  • 以函数形式调用时,this永远都是window
  • 以方法形式调用时,this就是调用方法的那个对象
    经典实例:
function fun(){
conole.log(this.name);
//conole.log(obj.name);
}
var obj={
 name:"孙悟空";
 sayName:fun
}
var obj2={
 name:"沙和尚";
 sayName:fun
}
this.sayName();
//obj.sayName();
//如果不用this就需要访问那个名字,就用这个名字.sayName(),步骤繁琐复杂
而用this,由于其是指的是上下文对象只需要如上写,就可达到想要都结果,方便
这就是this的妙用。

四.回调函数的理解

回调函数就是一个参数,将这个函数作为参数传到另一个函数里面,当那个函数执行完之后,再执行传进去的这个函数。这个过程就叫做回调

回调函数就是一个函数,他是在我们启动一个异步任务的时候就告诉他:等你完成这个任务的时候要干什么。
典型案例:

function A(callback){
callback();
console.log("我是主函数");
}
function B(){
setTimeout("console.log("我是回调函数")",3000)
;}
A(B);

五.事件冒泡和事件捕获

事件传递定义了元素事件触发的顺序。 如果你将

元素插入到

元素中,用户点击

元素, 哪个元素的 “click” 事件先被触发呢?

在 冒泡 中,内部元素的事件会先被触发,然后再触发外部元素,即:

元素的点击事件先触发,然后会触发

元素的点击事件。

在 捕获 中,外部元素的事件会先被触发,然后才会触发内部元素的事件,即:

元素的点击事件先触发 ,然后再触发

元素的点击事件。

addEventListener() 方法可以指定 “useCapture” 参数来设置传递类型:

addEVentListener(event,function,useCapture);
//默认值为false,即冒泡传递,当值为true时,即事件使用捕获传递。

六.原型函数和原型链

1.原型对象

我们所创建的每一个函数,解析器都会向函数添加一个属性prototype,这个属性对应这一个对象,这个对象就是我们所说的原型对象。
如果函数作为普通函数调用prototype没有任何作用,当函数以构造函数的形式调用时,他所创建的对象中都会有一个隐含的属性指向该构造函数的原型对象,我们可以用_proto_来访问该属性
原型对象就相当一个公共的空间,所有的同一个类里的实例都可以访问到这个原型对象
因此我们可以将对象共有的内容都统一设在原型对象中。
JavaScript对象有一个指向一个原型对象的链,当试图访问一个对象的属性时,它不仅仅可以在该对象上搜寻,还会搜寻该对象的原型,以及该对象的原型的原型,一次层层向上搜寻,直到找到一个名字匹配的属性或到达原型链的末尾。

今天的分享就到这里,希望对大家学习js有一些帮助。。

本文地址:https://blog.csdn.net/qq_47664976/article/details/113967290

《js必掌握的知识点.doc》

下载本文的Word格式文档,以方便收藏与打印。