JavaScript(三)——函数、变量作用域、方法

1. 函数

在JavaScript中,函数即对象,可以随意地被程序操控,函数可以嵌套在其他函数中定义,这样可以访问它们被定义时所处的作用域中的任何变量。
1)定义方式一(以绝对值函数abs()为例)
在这里插入图片描述
(2)定义方式二
在这里插入图片描述
function(x){…}这是一个匿名函数,但是可以把结果赋值给abs,通过abs就可以调用函数,方式一与方式二等价

(3)调用函数
在调用函数时,可以向其传递值,这些值被称为参数。javaScript 可以传任意个参数,也可以不传递参数
在这里插入图片描述
判断传递进来的参数是否存在问题,若存在问题,则手动抛出异常。
在这里插入图片描述
在这里插入图片描述
(4)arguments
arguments是一个JS免费赠送的关键字;代表传递进来的所有的参数,是一个数组
在这里插入图片描述
在这里插入图片描述
问题: arguments 包含所有的参数,我们有时候想使用多余的参数来进行附加操作。需要排除已有参数~

(5)rest
ES6 引入的新特性,获取除了已经定义的参数之外的所有参数
rest 参数只能写在最后面,且必须用… 标识
在这里插入图片描述
在这里插入图片描述

2. 变量的作用域

  • 在javascript中, var 定义变量实际是有作用域的,作用域可访问变量,对象,函数的集合。
  • 函数之外声明的变量,叫做全局变量,因为它可被当前文档中的任何其他代码所访问。在函数内部声明的变量,叫做局部变量,因为它只能在当前函数的内部访问。

(1)在函数体中声明,则在函数体外不可以使用 (非要想实现的话,后面可以研究一下闭包 )
在这里插入图片描述
(2)如果有两个函数使用了相同的变量名,只要在函数内部就不冲突
在这里插入图片描述
(3)内部函数可以访问外部函数的成员,反之则不行
在这里插入图片描述
在这里插入图片描述
(4)内部函数变量和外部函数的变量重名,由“内”向“外”查找
在这里插入图片描述
在这里插入图片描述
说明:在JavaScript 中 函数查找变量从自身函数开始,由 ‘’内‘’ 向 ‘’外‘’ 查找 。假设外部存在这个同名的函数变量,则内部函数会屏蔽外部函数的变量。

(5)提升变量的作用域

  • 先使用变量稍后再声明变量而不会引发异常,称为提升变量
    在这里插入图片描述
    在这里插入图片描述
    说明:JavaScript 变量感觉上是被“提升”或移到了函数或语句的最前面。但是,提升后的变量将返回 undefined 值,即不会提升变量y的赋值。

  • 规范操作
    在这里插入图片描述
    所有的变量定义都放在函数的头部,不要乱放,便于代码维护。

(6)全局函数

  • 全局变量
    在这里插入图片描述
    在这里插入图片描述
    (7) 全局对象 window
    在这里插入图片描述
    alert() 这个函数本身也是一个 window 变量
    在这里插入图片描述
    Javascript 实际上只有一个全局作用域, 任何变量(函数也可以视为变量),假设没有在函数作用范围内找到,就会向外查找,如果在全局作用域都没有找到,报错 RefrenceError

  • 规范
    由于我们所有的全局变量都会绑定到我们的 window 上。如果不同的js 文件,使用了相同的全局变量,就会发生冲突
    在这里插入图片描述
    解决办法:把自己的代码全部放入自己定义的唯一空间名字中, 降低全局命名冲突的问题。jQuery

(8)局部作用域:let
在这里插入图片描述
在这里插入图片描述
可以看到由 var 定义局部变量后,控制台从输出了11这个数,说明执行了console.log(i+1)语句, i 出了这个作用域还可以使用。这是不规范的!

ES6 引入let 关键字,解决局部作用域冲突问题
在这里插入图片描述
在这里插入图片描述
建议大家都是用 let 去定义局部作用域的变量

(9)常量 const

ES6 之前,怎么定义常量:只有用全部大写字母命名的变量就是常量;建议不要修改这样的值
在这里插入图片描述
在 ES6 引入了常量关键字 const
在这里插入图片描述

3. 方法

(1)定义方法
方法就是把函数放在对象的里面对象只有两个东西 : 属性和方法
在这里插入图片描述
在这里插入图片描述
this 是无法指向的,是默认指向调用它的那个对象

(2)apply 在js 中可以控制 this 指向
在这里插入图片描述

4. 内部对象

标准对象
在这里插入图片描述

4.1 Date

日期对象用于处理日期和时间
在这里插入图片描述
控制台输出
在这里插入图片描述
转换
在这里插入图片描述
控制台输出
在这里插入图片描述

4.2 JSON

早期,所有数据传输习惯使用 XML 文件

  • JSON(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式
  • 简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。
  • 易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率。
  • 在JavaScript 一切皆为对象、任何js 支持的类型都可以用JSON来表示;number,string…

格式

  • 对象都用 {}
  • 数组都用 []
  • 所有的键值对 都是用 key:value

JSON字符串 和 JS对象的转化

  • JSON.stringify( ); JS对象转化为JSON字符串
  • JSON.parse( ); JSON字符串转化为JS对象
    在这里插入图片描述
    在这里插入图片描述
    JSON 和 JS 对象的区别
    在这里插入图片描述

var obj = {a: ‘hello’,b:‘hellob’}; JS对象
var json = {“a”: “hello”,“b”:“hellob”}; JSON字符串,键必须加“ ”

4.3 Ajax

  • AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)
  • AJAX 不是新的编程语言,而是一种使用现有标准的新方法
  • AJAX 最大的优点是在不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。
  • AJAX 不需要任何浏览器插件,但需要用户允许JavaScript在浏览器上执行
  • 原生的js写法 xhr 异步请求
  • jQuey 封装好的方法 $(”#name“).ajax(“”)
  • axios 请求
发布了62 篇原创文章 · 获赞 2 · 访问量 2741

猜你喜欢

转载自blog.csdn.net/nzzynl95_/article/details/103915706