javascript基础（函数与方法的区别，变量作用域，变量和函数的声明提前，函数作用域）（十五）

最新推荐文章于 2023-03-30 23:11:11 发布
最新推荐文章于 2023-03-30 23:11:11 发布
阅读量289 收藏
点赞数
分类专栏： HTML5基础篇 文章标签： javascript 函数 html 经验
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u010853130/article/details/54924995
版权

1.函数与方法的区别：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			/*
			 * 方法（method）
			 */
			
			//创建一个对象
			var obj = {name:"孙悟空",age:18};
			
			//对象的属性也可以是对象
			obj.brother = {name:"猪八戒",age:28};
			
			//console.log(obj.brother.name);
			
			//对象的属性也可以是一个函数
			//当一个对象的属性是一个函数时，我们称这个函数是这个对象的方法
			//函数和方法只是称呼上的不同，本质上没有区别
			obj.sayName = function(){
				console.log("Hello 大家好 我是孙悟空~~~");
			};
			
			//console.log(obj.sayName);
			
			//当我们调用对象中的函数时，我们称我们在调用对象的方法
			//obj.sayName();
			
			var obj2 = {
				
						name:"沙和尚",
						age:38,
						sayName:function(){
							console.log("我是老沙~~~");
						}
			}
			
			obj2.sayName();
			
		</script>
	</head>
	<body>
	</body>
</html>

2.变量作用域： 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			/*
			 * 作用域（Scope）
			 * 	- 作用域简单来说就是指一个变量的作用的范围
			 * 	- 在JS中作用域分成两种：
			 * 		1.全局作用域
			 * 		2.函数作用域
			 * 
			 * 	- 全局作用域：
			 * 		1.所有直接在script标签中编写的代码都在全局作用域中
			 * 		2.全局作用域在打开网页时创建，在网页关闭时销毁
			 * 		3.全局作用域中有一个全局对象window，
			 * 			window代表的是浏览器的窗口，
			 * 			在全局作用域中创建的变量都会作为window对象的属性保存
			 * 			在全局作用域中创建的函数都会作为window对象的方法保存
			 * 		4.在全局作用域中创建的变量都是全局变量，可以在页面的任意位置访问
			 */
			
			var a = 123;
			var b = 456;
			
			//console.log(window.b);
			//console.log(window.c);
			
			function fun(){
				console.log(b);
				console.log("我是全局中的函数fun。。。。");
			}
			
			fun();
			
			//window.fun();
			
			//window.alert("hello");
			
			
			
		</script>
	</head>
	<body>
	</body>
</html>


3.变量和函数的声明提前： 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
		
			
			//如果不写var，直接为变量赋值，则相当于为window对象添加属性
			//window.a = 10;
			//a = 10;
			
			/*
			 * 变量的声明提前
			 * 	- 使用var关键字声明的变量，都会在所有的代码执行之前被声明，但是不会赋值
			 * 		赋值会直到执行到赋值的代码时才执行
			 * 	- 如果不适用var关键字声明变量，则不会有声明提前的特性
			 * 
			 * 函数的声明提前
			 * 	- 使用函数声明创建的函数，会在所有的代码执行之前创建，
			 * 		所以我们可以在函数声明前就去调用函数
			 * 	- 使用函数表达式创建的函数，没有这个特性，所以不能在它创建之前调用
			 */
			//console.log("a = "+a);
			
			var a = 10;
			
			//fun();
			//console.log(fun2);
			
			//使用函数声明来创建一个函数
			function fun(){
				console.log("我是fun函数。。。。");
			}
			
			//使用函数表达式创建一个函数
			var fun2 = function(){
				console.log("----->我是fun2.。。。");
			};
			
			
			
		</script>
	</head>
	<body>
	</body>
</html>

4.函数的作用域：

（一）

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			/*
			 * 函数作用域
			 * 	- 函数作用域可以理解为是全局中的小的作用域
			 * 	- 函数作用域在函数调用时创建，在调用结束时销毁
			 * 		每调用一次函数就会创建一个新的函数作用域
			 * 	- 在函数作用域中可以访问到全局变量,
			 * 		而在全局中无法访问到函数作用域中的变量
			 * 		在函数中创建的变量如果不写var，则会变成全局变量
			 * 	- 当我们在函数中使用一个变量时，它会先在自身的作用域中寻找，
			 * 		如果有就直接使用，如果没有则去上一级作用域中寻找，
			 * 		找到则使用，没找到则继续寻找，直到找到全局作用域为止
			 * 		如果全局作用域中依然没有，则报错ReferenceError
			 *  - 在函数作用域中也适用变量和函数的声明提前
			 * 	
			 */
			
			//创建一个全局变量a
			var a = "全局中的a";
			
			function fun(){
				//console.log(a);
				//window.b = ...
				var b = "---> 函数作用域中的b";
				
				//console.log(b);
			}
			
			//fun();
			
			//console.log(b);
			
			//创建全局变量c
			//var c = "全局c";
			
			/*function fun2(){
				
				//创建一个局部变量c
				var c = "---> 函数中的c";
				
				console.log(c);
				
			}
			
			fun2();*/
			
			function fun3(){
				
				//var c = "fun3中的c";
				
				function fun4(){
					
					//var c = "fun4中的c";
					
					console.log(c);
				}
				
				//调用fun4
				fun4();
				
			}
			
			//fun3();
			
			
			
			
		</script>
	</head>
	<body>
	</body>
</html>
（二） 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			
			var a = "全局a";
			
			function fun(){
				var a = "--> 函数a";
				
				//如果在函数作用域中想访问全局变量可以通过window对象来访问
				console.log(window.a);
			}
			
			//fun();
			
			a = 20;
			
			/*
			 * 在函数内部使用var关键字声明的变量也会被声明提前，
			 * 	它的声明会在所有的代码执行前执行
			 * 
			 * 在函数内部使用函数声明创建的函数，也会在所有的代码执行之前被创建
			 */
			function fun2(){
				
				fun3();
				
				//console.log(a);
				
				//var a = 10;
				
				function fun3(){
					console.log("我是fun2内部的函数。。。");
				}
				
				
			}
			
			fun2();
			
		</script>
	</head>
	<body>
	</body>
</html>

练习： 

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			/*var a = 10;
									
									function fun(){
										
										a = 5;
										
									}
									
									fun();
									
									console.log(a);*/

			var a = 123;

			/*
			 * 定义形参就相当于在函数中声明了对应的变量
			 */
			
			
			/*function fun(a) {
				alert(a);
				a = 456;
			}

			fun(); //undefined

			alert(a); //123*/

			var a = 123;

			function fun(a) {
				alert(a);
				a = 456;
			}
			
			fun(123); //123
			
			alert(a); //123
		</script>
	</head>

	<body>
	</body>

</html>





咸鸭蛋炒饭
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
Js的数据类型
Yangzijiand的博客
03-16 8004
Javascript数据类型分为基本数据类型与引用数据类型，其中基本数据类型为：字符串（String）、数字(Number)、布尔(Boolean)、、空值（Null）、未定义（Undefined）、symbol。引用数据，类型为对象(Object)，其中数组(Array)、函数（function）是一种特殊的对象。 基本数据类型： 一.JavaScript 字符串：字符串是存储字符的变量。 字符串可以是引号中的任意文本，可以使用单引号或双引号 可以使用索引位置来访问字符串中的每个字符 可以在..
js的数据类型
beeliang
04-13 427
基本数据类型 String、Number、Boolean、null、undefind、Symbol、BigInt 基本数据类型存储在栈内存中的，因为基础的数据类型占用空间比较小，大小值是固定的，通过值来访问，属于被频繁使用的数据 注意：Symbol和BigInt是ES6引入的新的数据类型 引用数据类型（复杂数据类型） Object、Date、Function、Array等等 引用的数据类型存储在堆内存中，因为引用的数据类型占空间比较大，占用内存大小也不固定。如果存储在栈中，则会影响到程序运行的性能，引用数
Javascript中引用数据类型
stay hungry, stay foolish
11-09 327
大多数引用类型值都是 Object 类型的实例，会继承Object中的一些方法，比如toString。创建对象的两种简单方式：
前端开发——JavaScript的数据类型和引用类型
qq_64552181的博客
03-30 844
var、let、const、 基本数据类型、类型之间的隐式转换、引用数据类型、输出函数或者方法
JS基本数据类型与引用数据类型
sssnanPl的博客
04-04 2962
JavaScript中的数据类型分为基本数据类型和引用数据类型，那么哪些是基本类型，哪些是引用类型，以及它们的区别是什么呢？ 基本数据类型 基本数据类型共有6种，包括String、Number、Boolean、Null、undefined以及ES6新增的Symbol。 引用数据类型 引用数据类型就是除基本数据类型外的数据，即Object对象类型，Array、Function、RegExp、Date都是对象类型。 基本数据类型与引用数据类型的区别 认识了基本数据类型与引用数据类型，那么它们
JavaScript 引用数据
珂鸣玉的博客
02-27 501
目录 一、Object ( Array 数组 Function 函数 Date 日期 ... object 对象 ) 二、数组 （本质： 连续的数据 （顺序） 连续的存储空间） 三、运算符 1、算术运算符 2、关系运算符 3、逻辑运算符 4、自增 自减运算符 四、如何判断数据类型 1、typeof 基本数据类型的判断 运算符 2、instanceof 引用数据类型的判...
JavaScript 基础函数_深入剖析变量和作用域
11-22
定义函数，在JavaScript中，定义函数的方式如下： function abs(x){ if(x >=0){ return x; }else{ return -x; } } 上述abs() 函数的定义如下： function 指出这是一个函数定义; abs 是函数的名称； (x) 括号内列...
关于javascript 回调函数中变量作用域的讨论
10-29
关于回调函数中变量作用域的讨论精品推荐，大家可以参考下。
JAVASCRIPT函数作用域和提前声明 分享
11-30
JavaScript中的函数作用域和变量声明提前是编程时必须理解的关键概念。不同于C或Java等其他语言，JavaScript并没有块级作用域（block scope），而是采用函数作用域（function scope）。这意味着变量在声明它们的函数...
JavaScript基本/引用数据类型及判断方法
楚楚梦厦的博客
11-04 4794
1. 常见的基本/引用数据类型 基本数据类型： Number、String 、Boolean、Null和undefined。基本数据类型是按值访问的，可以直接操作保存在变量中的实际值。 引用数据类型： Object基本上除了基本数据类型都是引用数据类型，如Array、Function、Date、RegExp、Error和自定义封装类等Object类型(根类)。 2. 数据类型的判断 typeof, instanceof, constructor, Object.prototype.toString.call
JavaScript中的基本数据类型与引用数据类型
wml00000的博客
08-17 1269
JavaScript中的基本数据类型与引用数据类型 转载自：https://www.cnblogs.com/c2016c/articles/9328725.html 1、栈(stack)和堆（heap） stack为自动分配的内存空间，它由系统自动释放；而heap则是动态分配的内存，大小也不一定会自动释放 2、数据类型 JS分两种数据类型： 基本数据类型：Number、String、Boole...
javascript基础之引用数据类型（对象）
weixin_51717662的博客
03-15 963
javascript中对象的定义，对象的分类（内建对象，宿主对象，自定义对象），对象的两种创建方法，对象的属性名和属性值，in运算符的作用，以及基本数据类型和引用数据类型的比较。
javascript高级程序第三版学习笔记【基本类型和引用类型】
weixin_34293911的博客
06-29 324
  基本类型和引用类型 ECMAScript包含两个不同类型的值：基本类型值和引用类型值。基本类型值指的是简单的数据段；引用类型值指由多个值构成的对象。当我们把变量赋值给一个变量时，解析器首先要做的就是确认这个值是基本类型值还是引用类型值。 常见的五种基本数据类型是： Undifined、Null、Boolean、Number和String。这五种基本数据类型可以直接操作保存在变量中的...
JavaScript基本数据类型与引用数据类型
SignalFire的博客
06-19 1185
基本数据类型：String、Number、Boolean、undefined、null、Symbol（ES6）引用数据类型：Object、Array、Function、Date基本数据类型存储在栈中，栈用于存储基本数据类型和执行代码引用数据类型存储在堆中有undefined是一个变量最原始的状态值，非人为操作null是人为地置空undefined == null判断是否为null：if（i === null）typeof是一个运算符（1）使用Number函数字符串：含有非数字为NaN，纯数字返回数字，""
JavaScript 面试题（二）JavaScript 里基本数据类型与引用数据类型有哪些？它们的区别是什么？
qq_42684926的博客
08-25 387
基本数据类型：Number、String、Boolean、Undefined、Null、Symbol。 引用数据类型：统称为 Object 类型。细分的话，有 Object 类型、Array 类型、Date 类型、RegExp 类型、Function 类型。 基本数据类型和引用数据类型的区别： 从内存角度来说，基本数据类型在内存中占据一块空间，空间里存储的就是数据。获取数据是直接获取。引用数据类型在内存中占据两块空间，第一块空间存储的是地址，第二块空间存储的是数据。获取数据是间接获取。 从赋值角度来说，基本
JavaScript两种数据类型对比
优搜新百土
08-10 903
在CEMAScript中，变量可以存放两种类型的值，即基本类型和引用类型 基本类型（原始类型） 基本类型有五种，即Undefined、Null、Boolean、Number、String 基本类型的值（原始值）是存放在栈中的简单数据字段。即，原始值直接存储在变量访问的位置。 引用类型 引用类型有三种，即Object、Function、Array 引用类型的值（引用值）是存储在堆中的对象。
javascript中的基本数据类型和引用数据类型
m0_64525676的博客
10-14 285
javascript中的基本数据类型和引用数据类型
js引用数据类型
qq_45723051的博客
11-28 67
<script> // [] 数组 // 数组里面可以存放任意的js 数据类型 // 数组是有序的 从0开始 索引值 var arr = []; // {} 对象 var obj = {}; // fun函数 var fun = function () {}; </script> 写代码; 1: 声明变量 ...
javascript实例区分基本数据类型和引用数据类型
EGeek
09-28 857
说之前先来介绍一下基本数据类型和引用数据类型指的到底是哪些数据类型。 1、五种基本数据类型：Number、String、Boolean、Null、Undefined 2、引用数据类型：Object 实例区分： &lt;script&gt; //基本数据类型代表Number var one = 666; var two = one; //此时two=666 one++; ...
前端笔记啦啦啦啦啦啦啦
最新发布
04-23
本文将总结JavaScript中的函数、变量作用域、方法和JSON等内容。 一、函数 1. 函数的定义方式有两种，一种是使用function关键字另一种是使用匿名函数。 2. 函数可以接收任意个参数，通过arguments数组保存传入的...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

咸鸭蛋炒饭

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值