1、函数的基本概念
函数是一个可执行的语句块,定义的时候不执行,调用的时候执行,使用"函数名()"的形式可以调用函数,
functionfun(){//定义函数,函数名为fun
//函数体
}
fun();//调用函数
functionfun(){
console.log("hello function")
}
fun();
定义一个函数,并调用了一次,这样就会在控制台输出一次“hellofunction”。
2、参数
function sum(){
var num1=10;
var num2=20;
var result=num1+num2;
console.log(result);
}
sum();
函数内部的代码是固定的,虽然可以多次使用,但是每次使用输出的都是10和20的加和,为了让函数更加灵活,
我们希望实现一个函数可以计算任意两个数的加和,那么我们就需要了解函数是如何传递参数的。
示例代码如下:
function fun(str){
console.log("hello"+str);
}
fun("world");
定义函数的括号中,我们添加了一个参数str,这个参数叫做形参。它在函数内部像一个变量一样。
但是在函数调用之前他是没有值的。当调用函数的时候,调用函数的括号中我们也添加了一个参数"world",
这个参数叫做实参,他可以是任意数据类型的值。函数被调用后,形参str被赋予了实参"world"的值,然
后执行console.log便会在控制台输出"helloworld"
函数可以传递多个参数,用逗号间隔
function sum(num1,num2){
console.log(num1+num2);
}
sum(10,20);
调用函数的时候,实参和形参是一一对应的,10对应的是num1,20对应的是num2,函数执行后会在控制台输出10和20的加和。
一个正整数参数n,当我们调用函数时,函数会输出包括n在内,1~n所有正整数的加和
示例代码如下:
function sum(n){
var sum=0;
for(var i=0;i<=n;i++){
sum+=i;
}
console.log(sum);}
sum(100);
sum(567);
3、返回值
输入了一个参数,函数就可以在控制台输出我们希望得到的结果,但是在实际开发中,很多情况我们要的不是在控制台输出得到的结果,
而单纯的只是为了获取这个值,那么我们就需要用到函数的返回值。
在函数中,我们可以通过return关键字指定一个返回值,函数有了return,当函数被调用的时候就可以把调用的结果赋值给另一个变量了
function fun1(){
}
functionfun2(){
return"hello fun";
}
var str1=fun1();
varstr2=fun2();
console.log(str1);//输出undefined
console.log(str2);//输出"hello fun"
函数fun1没有返回值,所有将fun1调用的结果赋值给str1,str1的值为undefined,
函数fun2有返回值,返回值是"hellofun",所以当fun2被调用后,将函数运行的结果赋值给str2,str2的值就是"hello fun"
4、函数表达式
var function Name=function(arg){
//函数体
}
这种形式看起来好像是常规的变量赋值语句,即创建一个函数并将它赋值给变量functionName。这种情况下创建的函数叫做匿名函数。
因为function关键字后面没有标识符。函数表达式与其他表达式一样,在使用之前必须先赋值;如下面代码就会导致错误;
helloworld();//错误,还未赋值,函数不存在
var helloworld=function(){
console.log("hello world");
}
有了函数表达式,我们就可以给函数表达式赋值了;如下面代码:
var helloworld;//声明
if(condition){//条件
helloworld=function(){//赋值
console.log("hello world");}
}else{
helloworld=function(){//赋值
console.log("你好,世界");}
}
5、函数声明提升
func()
function func(){
}
‘函数声明提升’,即将函数声明提升(整体)到作用域顶部(注意是函数声明,不包括函数表达式),实际提升后结果同下:
// 函数声明提升
function func(){
}
func()
6、作用域
在 JavaScript 中, 对象和函数同样也是变量。
在 JavaScript 中, 作用域为可访问变量,对象,函数的集合。
JavaScript 函数作用域: 作用域在函数内修改。
6.1 局部作用域
变量在函数内声明,变量为局部作用域。
局部变量:只能在函数内部访问。
// 此处不能调用 carName 变量
function myFunction(){
var carName="Volvo";// 函数内可调用 carName 变量
}
因为局部变量只作用于函数内,所以不同的函数可以使用相同名称的变量。
局部变量在函数开始执行时创建,函数执行完后局部变量会自动销毁。
6.2 全局变量
变量在函数外定义,即为全局变量。
全局变量有 全局作用域: 网页中所有脚本和函数均可使用。
var carName=" Volvo"; // 此处可调用 carName 变量
function myFunction(){// 函数内可调用 carName 变量
}
6.3 如果变量在函数内没有声明(没有使用 var 关键字),该变量为全局变量。
以下实例中 carName 在函数内,但是为全局变量。
// 此处可调用 carName 变量 function myFunction(){
carName="Volvo";// 此处可调用 carName 变量
}
1、对象的基本概念
在现实生活中,所有东西都可以看成对象,比如一台电脑,一个房子,一只猫,一个人,对象有他自己的属性,
比如电脑有颜色,房子有尺寸,猫和人都有年龄。
在JavaScript中,对象是属性的集合,他也是一种数据类型。
2、自定义对象
我们可以通过一对花括号来创建一个对象
varobj={}
varcat={//定义一个对象cat,它有两个属性,name和age
name:"喵喵",
age:2
}//有两种方法可以获取到对象的属性值:1、对象名.属性名;2、对象名["属性名"]
console.log(cat.name);
console.log(cat["name"]);
3、方法
通过上面的例子我们可以知道name的属性值是字符串类型,age的属性值是数值类型。其实对象的属性值可以是任何数据类型,甚至可以是函数,如果对象的属性值是函数,那么我们叫这个属性为这个对象的方法
var cat={
name:"喵喵",
age:2,
sayName(){
console.log("我是喵喵");}
}
cat.sayName();
4、this关键字
var cat={
name:"喵喵",
age:2,
sayName:function(){
console.log("我是喵喵")}
}
cat.name="小白";
console.log(cat.name);//输出"小白"
cat.sayName();//输出"我是喵喵"
因为猫的名字已经改变,但是sayName方法里面的名字并没有一同变化,我们可以通过this关键字实现修改了名字,方法里面的名字也会改变。
在对象的方法中使用this,可以指向这个对象本身,
var cat={
name:"喵喵",
age:2,
sayName:function(){
console.log("我是"+this.name)}
}
cat.sayName();//输出“我是喵喵”
cat.name="小白";
console.log(cat.name);//输出"小白"
cat.sayName();//输出“我是小白”
5、方法传参
给对象的方法传递参数和给函数传递参数是一样的
示例代码如下:
var cat={
name:"喵喵",
age:2,
sayName:function(){
console.log("我是"+this.name)
},
count:function(num1,num2){
console.log(num1+num2);
}}
cat.sayName();
cat.count(10,20);
我们在之前代码的基础上,有添加了一个count方法可以让猫可以计算两个数的加和,我们只要传入实参,猫就能计算结果。
6、对象展开运算符
letxiaoMing={
name:"小明",
age:2
}
let superXiaoMing={
weight:"1000kg",
fly:true
}
let superHero={
...xiaoming,...sukperXiaoming
}
console.log(superHero)