javaScript快速入门之对象与函数

javaScript对象与函数


为什么要引出对象:

  • 使用基本类型创建的数据,都是独立的不能成为一个整体
  • 对象是一种复合的数据类型,在对象中可以保存多个不同数据类型的属性(像一个旅行箱)

对象的分类

  • 内建对象(由es标准中定义的对象,在任何的es的实现中都可以使用)
  • 宿主对象:由JS的运行环境提供的对象,主要由浏览器提供的对象(BOM、DOM)
  • 自定义对象:由开发人员自己创建的对象

创建对象:

  • 使用new关键字调用的函数,是构造函数constructor
  • 专门用来创建对象的函数
var obj = new Object(); 
console.log(obj); // [object Object] 空对象 箱子里面没东西
console.log(typeof obj); // object

向对象中添加属性

  • 在对象中保存的值称为属性
  • 语法:对象.属性名 = 属性值;
  • 对象属性名不强制遵守标志符规范
  • 如果使用特殊属性名,不能采用.的方式操作,需要采用:对象[“属性名”]
  • 最高的运算符优先级
  • 属性值可以是任意的数据类型,也可以是一个对象
var obj = new Object(); 
obj.name = 'dd';
obj.age = 15;
obj.gender = 'male';
console.log(obj); // 在外部浏览器可以访问到
console.log(obj.name); //和python中的字典类似

obj["12"] = 'hello'
console.log(obj['12'])  // 使用[] 更加的灵活,直接传递一个变量

var obj2 = new Object(); 
obj2.name = 'gg';
obj.name = obj2
console.log(obj.name); // {name:'gg'}
console.log(obj.name.name); // gg  相当于旅行箱中又装了一个铅笔盒

in 运算符 //检查一个对象中是否包含指定的属性
属性名 in 对象
console.log("name" in obj); // true

在内存保存的方式

js中的变量都是保存在栈内存中的

基本数据类型的值直接在栈内存中存储(变量 值)

值与值之间互相独立,不影响其他变量

对象是保存到堆内存中的

var a = 123;
var b = 123;
a++;
a = 124; //变量b不会受到影响

var obj = new Object(); 
obj.name = 'dd'
var obj2 = obj
obj.name = "gg"
// 在堆内存中开辟新的空间 有地址0x12  往堆内存中添加 name = dd -> gg
// 那么obj2的name也会变
// 在栈内存中保存地址 obj 0x12,   obj2  0x12(将地址在栈内存复制一份)
// 每创建一个新的对象,就会在堆内存中开辟出一个新的空间

在这里插入图片描述

var obj3 = new Object();
var obj4 = new Object();
obj3.name = 'dd';
obj4.name = 'dd';
console.log(obj2 == obj3); // false 地址不同,每次new都会开辟新的空间
// 比较两个引用数据类型时 ta是比较的对象的内存地址

对象字面量

  • 使用对象字面量来创建一个对象

    var obj = {}; //对象字面量 简单方便
    console.log(typeof obj); // object Object
    
    //使用对象字面量,可以在常见对象时直接指定对象中的属性,属性名可以加引号也可以不加
    // 如果使用一些特殊的属性名必须要加引号
    // 和python的字典中键值对一样,ta叫名值对
    var obj2 = {name:"bob",age:18,test:{name:'hello'}}; // 创建对象,并添加属性
    

函数

创建函数的三种方式

  • 一切皆是对象(function)

  • 函数中可以封装一些功能,在需要是执行这些代码

  • 在需要的时候进行调用

  • 可以将封装的代码以字符串的形式传递给 构造函数

  • var fun = new Function(); //创建一个函数对象
    var fun = new Function("console.log('hello')"); // js代码存在函数对象里
    // 封装到函数中的代码不会立即执行,只是存在内存中
    // 在调用时会执行
    // 函数的调用:函数对象(),函数中的代码会按照顺序执行
    fun(); // 调用fun这个函数
    这种方法不常用
    
  • 使用函数声明创建一个函数 function关键字创建

  • function 函数名([形参1,形参...]){  // []表示可选的,可写可不写
    	函数体
    }
    function fun2(){
    	console.log('hello')
    }
    fun2();
    console.log(fun2); // 调用函数
    
    
  • 使用函数表达式创建一个函数

  • var 函数 = function([形参1,形参...]){
    	语句
    }
    
    var fun3 = function(){
    	console.log('匿名函数');
    } // 创建一个匿名函数,在赋值给一个变量
    fun3();
    
    

    创建函数时,使用声明函数和函数表达式来创建函数

函数的参数

定义一个函数来求求和

  • 在函数()中指定一个或多个形参
  • 多个形参之间使用逗号隔开
  • 声明形参就相当于在函数内部声明了对应的变量,没有赋值
  • 在调用函数()在这指定实参,实参将会赋值函数中对应的形参
function sum(a,b){
	console.log(a+b);
}

sum(1,2);
sun(1,'hi'); // 调用函数时,解析器不会检查实参类型,注意是否接受非法参数
//如果实参数量少,没哟对应实参的形参是undefined + 1 = NaN

// 如果参数过多,可以将参数封装到一个对象对象,然后通过对象进行传递
function say(u){
	console.log(u.name,u.age,u.gender);
}

var obj = {
	name:'bob',
	age = 18,
	gender:male
}
say(obj);

// 实参也可以是个函数

function fun(a){ // a接受到 say函数
	a(obj);  // say(obj) == console.log(u.name,u.age,u.gender);
}
fun(say); // 往fun传递参数


fun(function(){alert('hello')}); //讲一个匿名函数传递给实参


sum:函数对象
sum():调用函数
fun(sum(1,3));

函数返回值

  • 使用return 来设置函数的返回值
  • return后的值将会作为结果返回
  • 定义一个变量,接收结果
  • return 后面不跟值 == return undefined
  • 使用return 可以结束整个函数
function sum(a,b){
	return a+b;
}

var res = sum(1,2); // 函数返回什么res就是什么

function fun(){
	return null;
}
fun(); // null 可以是任意类型的数

function fun(){
	obj = {name:'ofo'}
	return obj;
}
var a = fun();
console.log(a.name); // ofo

function fun2(){
	function fun3(){
		alert('warning');
	}
	return fun3;
}
var a = fun2();
console.log(a); //返回函数的对象
a(); // 调用fun3()

函数题目

//计算圆的面积
function area(r){
	return 3.14*r*r;
}
area(10);

// 枚举对象中的属性
var obj = {
	name:'bob',
	age:18,
	gender:'male',
	address:'asd'
}

for(var i in obj){
	console.log(obj[i]); //将对象分别打印出来
}

立即执行函数

(function(){
	alert('匿名函数')  // 调用一次就不用了
})()  // 表示一个整体,不会报错 ,这样就可以调用这个匿名函数
// 只能执行一次 在()也可以进行传值

猜你喜欢

转载自blog.csdn.net/qq_42992704/article/details/105037385