首页 > 编程语言 >JavaScript高阶 day-04

JavaScript高阶 day-04

时间:2024-08-29 13:24:26浏览次数:11  
标签:闭包 function 函数 04 JavaScript 模式 严格 拷贝 day

目录

一.严格模式

1.1什么是严格模式

1.2开启严格模式

1.3严格模式中的变化

二.高阶函数

三.闭包

3.1 变量的作用域

3.2 什么是闭包

3.3 闭包的作用

3.4 闭包的案例

四.递归

4.1 什么是递归

4.2 利用递归求1~n的阶乘

五.赋值(地址传递)-浅拷贝-深拷贝

5.1 地址传递

5.2 Object.assign()实现浅拷贝

5.3 深拷贝

5.3.1 递归深复制对象

5.3.2 使用JSON方法


一.严格模式

1.1什么是严格模式

JavaScript 除了提供正常模式外,还提供了严格模式(strict mode)。ES5 的严格模式是采用具有限制性 JavaScript变体的一种方式,即在严格的条件下运行 JS 代码。

严格模式在 IE10 以上版本的浏览器中才会被支持,旧版本浏览器中会被忽略。

严格模式对正常的 JavaScript 语义做了一些更改:

1.消除了 Javascript 语法的一些不合理、不严谨之处,减少了一些怪异行为。

2.消除代码运行的一些不安全之处,保证代码运行的安全。

3.提高编译器效率,增加运行速度。

4.禁用了在 ECMAScript 的未来版本中可能会定义的一些语法,为未来新版本的 Javascript 做好铺垫。比如一些保留字如:class,enum,export, extends, import, super 不能做变量名

1.2开启严格模式

严格模式可以应用到整个脚本或个别函数中。因此在使用时,我们可以将严格模式分为为脚本开启严格模式和为函数开启严格模式两种情况。

  • 情况一 :为脚本开启严格模式

    • 有的 script 脚本是严格模式,有的 script 脚本是正常模式,这样不利于文件合并,所以可以将整个脚本文件放在一个立即执行的匿名函数之中。这样独立创建一个作用域而不影响其他 script 脚本文件。

      <script>
         "use strict"; //当前script标签开启了严格模式
      </script>
      <script>
                  //当前script标签未开启严格模式
      </script>

  • 情况二: 为函数开启严格模式

    • 要给某个函数开启严格模式,需要把“use strict”; (或 'use strict'; ) 声明放在函数体所有语句之前。

      function fn(){
        "use strict";
        return "123";
      } 
      //当前fn函数开启了严格模式

1.3严格模式中的变化

严格模式对 Javascript 的语法和行为,都做了一些改变。

'use strict'
num = 10 
console.log(num)//严格模式后使用未声明的变量
--------------------------------------------------------------------------------
function fn() {
 console.log(this); // 严格模式下全局作用域中函数中的 this 是 undefined
}
fn();  
---------------------------------------------------------------------------------
function Person() {
     this.sex = '男';
}
// Person();严格模式下,如果构造函数不加new调用, this 指向的是undefined 如果给他赋值则 会报错.
var p1 = new Person();
console.log(p1.sex);
----------------------------------------------------------------------------------
setTimeout(function() {
  console.log(this); //严格模式下,定时器 this 还是指向 window
}, 2000);  
----------------------------------------------------------------------------------
// 严格模式下,函数里的参数不允许重名
    function fun1(num, num) {
    console.log(num + num);
};
fun1(2, 3);

二.高阶函数

高阶函数是对其他函数进行操作的函数,它接收函数作为参数或将函数作为返回值输出。符合以下条件其一:

  • 参数是函数

  • 函数作为返回值

此时fn 就是一个高阶函数

函数也是一种数据类型,同样可以作为参数,传递给另外一个参数使用。最典型的就是作为回调函数。

同理函数也可以作为返回值传递回来。

三.闭包

3.1 变量的作用域

变量根据作用域的不同分为两种:全局变量和局部变量。

  1. 函数内部可以使用全局变量。

  2. 函数外部不可以使用局部变量。

  3. 当函数执行完毕,本作用域内的局部变量会销毁。

注意:函数内部可以直接读取全局变量,但是在函数外部无法读取函数内部的局部变量。

思考:如何从外部读取函数内部的局部变量?

出于种种原因,我们有时候需要获取到函数内部的局部变量。但是,上面已经说过了,正常情况下,这是办不到的!只有通过变通的方法才能实现,那就是在函数内部,再定义一个函数。

3.2 什么是闭包

函数和对其周围状态(lexical environment,词法环境)的引用捆绑在一起构成闭包closure)。也就是说,闭包可以让你从内部函数访问外部函数作用域。

3.3 闭包的作用

作用:延伸变量的作用范围。

 function fn() {
   var num = 10;
   function fun() {
       console.log(num);
    }
    return fun;
 }
var f = fn();
f();

总结:

  • 闭包有三个特性:

  1. 函数嵌套函数

  2. 函数内部访问外部函数的参数或变量

  3. 可以使函数中的变量可以长期驻扎在内存

  • 使用闭包的好处 1.使函数内部变量长期驻扎在内存中 2.避免全局变量的污染(多人定义同样名字的全部变量冲突)

  • 使用闭包的坏处: 内存泄漏(应用程序不再用到的内存,由于某些原因,没有及时释放,就叫做内存泄漏。)

3.4 闭包的案例

  1. 利用闭包的方式得到当前li 的索引号

for (var i = 0; i < lis.length; i++) {
// 利用for循环创建了4个立即执行函数
// 立即执行函数也成为小闭包因为立即执行函数里面的任何一个函数都可以使用它的i这变量
(function(i) {
    lis[i].onclick = function() {
      console.log(i);
    }
 })(i);
}

四.递归

4.1 什么是递归

递归:如果一个函数在内部可以调用其本身,那么这个函数就是递归函数。简单理解:函数内部自己调用自己, 这个函数就是递归函数

注意:递归函数的作用和循环效果一样,由于递归很容易发生“栈溢出”错误(stack overflow),所以必须要加退出条件return。

4.2 利用递归求1~n的阶乘

//利用递归函数求1~n的阶乘 1 * 2 * 3 * 4 * ..n
 function fn(n) {
     if (n == 1) { //结束条件
       return 1;
     }
     return n * fn(n - 1);
 }
 console.log(fn(3));

五.赋值(地址传递)-浅拷贝-深拷贝

5.1 地址传递

复制数组、对象时,将采用地址传递地址的方式,修改其中一个,另外一个将受到影响.

5.2 Object.assign()实现浅拷贝

浅拷贝

  • 复制指向某个对象的指针,而不复制对象本身,新旧对象共享一块内存;浅拷贝就是只拷贝一层,更深层次对象级别只拷贝引用(地址)当拷贝的新对象发生改变时,原对象也会发生相同的改变,也就是说,浅拷贝会影响原来的数据

Object.assign()方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象。

Object.assign(target, ...sources)

参数: target:目标对象。sources:源对象。

返回值:返回目标对象。

5.3 深拷贝

  • 每一级的数据都会拷贝 深拷贝只拷贝内容,两个对象拥有不同的地址,当拷贝出来的对象发生改变时,原对象内容不会改变,两者互不影响

5.3.1 递归深复制对象
// 封装函数 
function deepCopy(newobj, oldobj) {
    for (var k in oldobj) {
        // 判断我们的属性值属于那种数据类型
        // 1. 获取属性值  oldobj[k]
        var item = oldobj[k];
        // 2. 判断这个值是否是数组
        if (item instanceof Array) {
            newobj[k] = [];
            deepCopy(newobj[k], item)
        } else if (item instanceof Object) {
            // 3. 判断这个值是否是对象
            newobj[k] = {};
            deepCopy(newobj[k], item)
        } else {
            // 4. 属于简单数据类型
            newobj[k] = item;
        }
    }
};
5.3.2 使用JSON方法
JSON.parse(JSON.stringify(obj))

标签:闭包,function,函数,04,JavaScript,模式,严格,拷贝,day
From: https://blog.csdn.net/BXY369/article/details/141612446

相关文章

  • JavaScript高阶 day-03
    目录一.函数内部的this指向二.函数对象的原型的方法2.1Function.prototype.call()---call()方法2.2Function.prototype.apply()---apply()方法2.3Function.prototype.bind()---bind()方法2.4call、apply、bind三者的异同2.5Object.prototype.toString()判断数据类......
  • DL00489-基于深度学习的金属多轴疲劳寿命预测含数据集
    使用深度学习模型(CNN,LSTM和GRU)结合全连接层预测金属多轴疲劳寿命的代码。它处理数据集,利用高质量的数据来有效地训练和评估模型。主要功能是结合时间序列加载路径和材料力学性能对疲劳寿命进行预测。      ......
  • 代码随想录算法day2-数组2
    题目1209.长度最小的子数组给定一个含有n个正整数的数组和一个正整数target。找出该数组中满足其总和大于等于target的长度最小的子数组[numsl,numsl+1,...,numsr-1,numsr],并返回其长度。如果不存在符合条件的子数组,返回0。示例1:输入:target=7,nums=[2,......
  • 代码随想录day44 || 1143 最长公共子序列, 1035 不相交的线, 53 最大子序列和, 392 判
    1143最长公共子序列funclongestCommonSubsequence(text1string,text2string)int{ //思路和判断最长公共数组一样 //dp[i][j]表示以text1[i],text2[j]为结尾的最长公共子序列的长度 //iftext1[i]==text2[j]{dp[i+1][j+1]=dp[i][j]+1}else{dp[i+1][j+1]=......
  • Day50.head内常用标签
    1.head内常用标签_titile标签_style标签_body标签用法2.head内常用标签_script标签内用来写js代码3.head内常用标签_script标签导入其他js文件显示4.head内常用标签_link标签导入其他css文件显示5.head内常用标签_meta标签定义两秒后跳转到指定标签6.head内常用标签_告诉IE以最......
  • x86 docker 20.04 交叉编译 jetson xavier nx 20.04
    前文:https://www.cnblogs.com/odesey/p/183814071.jetson和x86交叉编译在https://developer.nvidia.com/embedded/jetson-linux-r3541,下载:BootlinToolchaingcc9.3解压得到,并创建文件夹:/home/用户名/docker_workspace/mycrosscompile/Bootlin-Toolchain-gcc-9.3在......
  • Javascript里的闭包
    闭包闭包,允许函数访问创建时的作用域中的变量,即使该函数在其原始作用域之外被执行。这使得闭包非常适合用于封装私有变量和创建具有特定状态的函数。Javascript里的闭包functioncreateCounter(){letcount=0;//计数器的私有变量return{increment:f......
  • JavaScript
    一,js中的数据类型1数值型:number整数和浮点数统称为数值。例如85或3.1415926等。2字符串型:String由0个,1个或多个字符组成的序列。在JavaScript中,用双引号或单引号括起来表示,如"您好"、'学习JavaScript'等。3逻辑(布尔)型:boolean用true或false来表示。4空(null)值:表示没有......
  • day06(IO进程)进程 process
    目录一.什么是进程1. 概念2. 特点3.进程段4.进程分类5.进程状态6.进程状态切换图7. 进程相关命令补充:优先级调度(笔试可能遇见)二.进程函数接口1. 创建进程fork()2.回收资源waitwaitpid3.结束进程4.获取进程号getpid getppid三.exec函数族(了解......
  • JavaScript变量和数据类型
    一、变量1、简介​在程序运行过程中其值可以改变的量,是一个数据存储空间的表示,即给内存空间起别名​将数值通过变量进行存储,以便程序随时使用,通俗点来说,变量就是用来存储数据的​JavaScript是弱变量类型的语言,声明变量只需要使用var关键字​语法:var变量名=变量值;<s......