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代码的时候,分为两个过程:预解析过程和代码执行过程
预解析过程:
- 把变量的声明提升到当前作用域的最前面,只会提升声明,不会提升赋值。
- 把函数的声明提升到当前作用域的最前面,只会提升声明,不会提升调用。
- 先提升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运 算符一起使用在创建对象的语句中。
- 构造函数用于创建一类对象,首字母要大写。
- 构造函数要和new一起使用才有意义。
new在执行时会做四件事情
new会在内存中创建一个新的空对象
new 会让this指向这个新的对象
执行构造函数 目的:给这个新对象加属性和方法
new会返回这个新对象
this详解
JavaScript中的this指向问题,有时候会让人难以捉摸,随着学习的深入,我们可以逐渐了解 现在我们需要掌握函数内部的this几个特点:
- 函数在定义的时候this是不确定的,只有在调用的时候才可以确定
- 一般函数直接执行,内部this指向全局window
- 函数作为一个对象的方法,被该对象所调用,那么this指向的是该对象
- 构造函数中的this其实是一个隐式对象,类似一个初始化的模型,所有方法和属性都挂载到了这个隐式对象身上,后续通过new关键字来调用,从而实现实例化