JavaScript 1029 作用域 预解析 对象

JavaScript函数

arguments的使用

JavaScript中arguments对象是比较特别的一个对象,实际上是当前函数的一个内置属性。也就是说所有函
数都内置了一个arguments对象,arguments对象中存储了传递的所有的实参。arguments是一个伪数组,因
此及可以进行遍历。
例如:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>arguments</title>
	</head>
	<body>
		<script>
		//arguments
		function test(){
			console.log(arguments);
		    for (var i=0;i<arguments.length;i++){
			    console.log(arguments[i]);
		      }	
		}
	    test(1,2,3,4,5);
		
		//求任意个数的最大值
		function test(){
			var max=arguments[0];
			console.log(arguments);
			for(var i=0;i<arguments.length;i++){
	            if (max<arguments[i]) {
			        max=arguments[i];
			     }
			}
			console.log(max);			
			
		}
            // 任意个数的和
            var sum=0;
            for(var i=0;i<arguments.length;i++){
               sum+=arguments[i];
            }
            console.log(sum);
        }
        test(23,23,31,40,5,40,12222,343,112,99,1234);
		</script>
	</body>
</html>

函数其它

匿名函数

匿名函数:没有名字的函数

匿名函数如何使用:

将匿名函数赋值给一个变量,这样就可以通过变量进行调用 匿名函数自调用

关于自执行函数(匿名函数自调用)的作用:防止全局变量污染。

自调用函数

匿名函数不能通过直接调用来执行,因此可以通过匿名函数的自调用的方式来执行
(function () {
alert(123);
})();

函数是一种数据类型

function fn() {}
console.log(typeof fn);

  • 函数作为参数
    因为函数也是一种类型,可以把函数作为另一个函数的参数,在另一个函数中调用
  • 函数作为返回值
    因为函数是一种类型,所以可以把函数可以作为返回值从函数内部返回,这种用法在后面很常见。

function fn(b) {
var a = 10;
return function () {
alert(a+b);
}
}
fn(15)();

代码规范

1.命名规范
2.变量规范
var name = ‘zs’;
3.注释规范
// 这里是注释
4.空格规范
5.换行规范
var arr = [1, 2, 3, 4];
if (a > b) {
}
for(var i = 0; i < 10; i++) {
}
functionfn() {
}

作用域

作用域:变量可以起作用的范围

全局变量和局部变量

  • 全局变量
    在任何地方都可以访问到的变量就是全局变量,对应全局作用域
  • 局部变量
    只在固定的代码片段内可访问到的变量,最常见的例如函数内部。对应局部作用域(函数作用域)

不使用var声明的变量是全局变量,不推荐使用。 变量退出作用域之后会销毁,全局变量关闭网页或浏览器才会销毁

块级作用域

任何一对花括号({和})中的语句集都属于一个块,在这之中定义的所有变量在代码块外都是不可见的,我们称之
为块级作用域。 在es5之前没有块级作用域的的概念,只有函数作用域,现阶段可以认为JavaScript没有块级作用域。

词法作用域

变量的作用域是在定义时决定而不是执行时决定,也就是说词法作用域取决于源码,通过静态分析就能确定,因此词法作用域也叫做静态作用域。
在 js 中词法作用域规则:

  • 函数允许访问函数外的数据.
  • 整个代码结构中只有函数可以限定作用.
  • 作用域规则首先使用提升规则分析.
  • 如果当前作用规则中有名字了, 就不考虑外面的名字.
var num = 123; 
function foo() {
  console.log( num );
}
foo(); 

if ( false ) {
    var num = 123; 
}console.log( num ); // undefiend

作用域链

只有函数可以制造作用域结构, 那么只要是代码,就至少有一个作用域, 即全局作用域。凡是代码中有函数,那么这个函数就构成另一个作用域。
如果函数中还有函数,那么在这个作用域中就又可以诞生一个作用域。 将这样的所有的作用域列出来,可以有一个结构:
函数内指向函数外的链式结构。就称作作用域链。

// 案例1: 
function f1() {
    function f2() { 
    } 
}

var num = 456; 
function f3() { 
     function f4() { 
     } 
}

在这里插入图片描述

// 案例2
function f1() {
     var num = 123;
     function f2() { 
        console.log( num ); 
        }
        f2();
}var num = 456; 
f1();

在这里插入图片描述

预解析

JavaScript代码的执行是由浏览器中的JavaScript解析器来执行的。JavaScript解析器执行JavaScript代码的时候,分为两个过程:预解析过程和代码执行过程

预解析过程:

  1. 把变量的声明提升到当前作用域的最前面,只会提升声明,不会提升赋值。
  2. 把函数的声明提升到当前作用域的最前面,只会提升声明,不会提升调用。
  3. 先提升var,在提升function

JavaScript的执行过程

var a = 25; 
function abc (){
    alert(a);//undefined 
    var a = 10; 
    }abc();
    // 如果变量和函数同名的话,函数优先 console.log(a); function a() { console.log('aaaaa'); }var a = 1; console.log(a);

全局解析规则

函数内部解析规则

变量提升

  • 变量提升
    定义变量的时候,变量的声明会被提升到作用域的最上面,变量的赋值不会提升。
  • 函数提升

JavaScript解析器首先会把当前作用域的函数声明提前到整个作用域的最前面

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<script>
			// 1、-------------------
			 var num = 10; fun(); function 
			 fun() { 
				 console.log(num); 
				 var num = 20; }
		    //2、----------------------- 
			var a = 18; 
			f1();
			function f1() { 
			var b = 9; 
			console.log(a); 
			console.log(b); 
			var a = '123'; }
			// 3、----------------------
			f1(); 
			console.log(c); 
			console.log(b); 
			console.log(a); function f1() {
				var a = b = c = 9;
			console.log(a); 
			console.log(b); 
			console.log(c); 
			}
		</script>
	</body>
</html>

对象(核心)

(1)对象: 现实生活中,万物皆对象,对象是一个具体的事物,一个具体的事物就会有行为和特征。万事万物都是对象;
(2)三大特征: 属性,方法(主动的行为),事件(被动的行为)
属性和行为
(2)JS中对象如何定义?
第一种方式: 使用function关键字定义;
第二种方式: 使用字面量的方式定义对象;

对象字面量

字面量:11 ‘abc’ true [] {}等

var o = { 
   name: 'zs,
   age: 18, 
   sex: true, 
   sayHi: function () { 
      console.log(this.name); 
      } 
   };

对象创建方式

对象字面量

var o = { 
   name: 'zs', 
   age: 18, 
   sex: true, 
   sayHi: function () { 
     console.log(this.name); 
   } 
};

new Object()创建对象

var person = new Object();
   person.name = 'lisi'; 
   person.age = 35;
   person.job = 'actor'; 
   person.sayHi = function(){
     console.log('Hello,everyBody'); 
}

工厂函数创建对象

function createPerson(name, age, job) { 
   var person = new Object(); 
   person.name = name; 
   person.age = age; 
   person.job = job; 
   person.sayHi = function(){                  
        console.log('Hello,everyBody'); 
   }
   return person; 
}
var p1 = createPerson('张三', 22, 'actor');

自定义构造函数

function Person(name,age,job){ 
  this.name = name; 
  this.age = age; 
  this.job = job; 
  this.sayHi = function(){                        
      console.log('Hello,everyBody'); 
   } 
}
  var p1 = new Person('张三', 22, 'actor');

属性和方法

如果一个变量属于一个对象所有,那么该变量就可以称之为该对象的一个属性,属性一般是名词,用来描述事物的特征。
如果一个函数属于一个对象所有,那么该函数就可以称之为该对象的一个方法,方法是动词,描述事物的行为和功能。

new关键字

构造函数 ,是一种特殊的函数。主要用来在创建对象时初始化对象, 即为对象成员变量赋初始值,总与new运 算符一起使用在创建对象的语句中。

  1. 构造函数用于创建一类对象,首字母要大写。
  2. 构造函数要和new一起使用才有意义。

new在执行时会做四件事情

new会在内存中创建一个新的空对象
new 会让this指向这个新的对象
执行构造函数 目的:给这个新对象加属性和方法
new会返回这个新对象

this详解

JavaScript中的this指向问题,有时候会让人难以捉摸,随着学习的深入,我们可以逐渐了解 现在我们需要掌握函数内部的this几个特点:

  1. 函数在定义的时候this是不确定的,只有在调用的时候才可以确定
  2. 一般函数直接执行,内部this指向全局window
  3. 函数作为一个对象的方法,被该对象所调用,那么this指向的是该对象
  4. 构造函数中的this其实是一个隐式对象,类似一个初始化的模型,所有方法和属性都挂载到了这个隐式对象身上,后续通过new关键字来调用,从而实现实例化
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值