函数基础+对象

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)

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,098评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,213评论 2 380
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 149,960评论 0 336
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,519评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,512评论 5 364
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,533评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,914评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,574评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,804评论 1 296
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,563评论 2 319
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,644评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,350评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,933评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,908评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,146评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,847评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,361评论 2 342

推荐阅读更多精彩内容