本文共 4351 字，大约阅读时间需要 14 分钟。
文章目录
对象
-
JS中对象分为两种 js中对象可以通过点语法动态添加属性和方法。
-
狭义对象
-
用{ }表示；狭义对象可以拥有许多属性和方法
-
右侧的属性值为function，则为方法。否侧称之为属性。
var obj = { name:"小明", age:18, sex:"男", eat:function(){ console.log("我可以吃八斤米饭"); } }; //检测当前对象类型 console.log(typeof obj); //获取属性值 console.log(obj.name); console.log(obj.age); console.log(obj.sex); console.log(obj.eat); //重新修改属性值 obj.name = "二哈"; obj.age = 2; obj.sex = "公"; //动态添加属性、方法 obj.color = "白加黑"; obj.yaoren = function(){ console.log("我可以咬人"); }obj.eat();//调用方法obj.yaoren();
-
-
广义对象 如果是引用类型数据，且系统提供内置属性和方法的对象，称之为广义对象。
-
函数
-
有name、 length属性可以获取函数名和形参个数。
-
函数也可以动态添加自定义属性
var obj={ name:'zdc', age:18, sex:'男', eat:function(){ console.log("我很能吃"); } } console.log(typeof obj) function multi(a,b) { return a*b; } console.log(multi.name); console.log(multi.length); multi.age=19; multi.sex='male'; console.log(multi.sex);
-
-
-
数组
-
属性 length 方法：join()、concat()、reverse()
-
数组也可以动态的添加属性和方法。
//广义对象------数组var arr = ["吃饭",'睡觉','打豆豆'];console.log(arr.length);console.log(arr.reverse());console.log(arr.join());//动态添加属性和方法arr.xingming ="小红";arr.age = 18;arr.sex = "女";console.log(arr.xingming);
-
-
-
在JS当中对象【狭义、广义】：可以通过点语法动态添加自定义属性、方法。
狭义对象：其实狭义对象即为大花括号表示
广义对象对象:广义对象除了自定义属性、方法意外，系统给它提供了内置属性和方法使用；
大总结：其实在JS当中只要是引用类型数据即为对象
什么不是对象
-
概述：在JS当中基本数据类型数值都不是对象：（如果不是对象不能通过点语法动态添加属性和方法）
比如：数字、字符串、布尔值、未定义、空对象。
NaN不是数据类型，它只是Number（数字类型中的一个特殊值）
函数上下文
-
函数上下文即为this，只能在函数体中使用。所代表的数值不是固定的，取决于函数如何调用。
-
函数执行在JS当中有几种呀？（五种）
-
函数名+小括号 ;
-
函数名+小括号执行，函数体中上下文为window[即为BOM对象：浏览器对象]
-
//先认识BOM【browser object model】浏览器对象模型 //在模拟浏览器 //函数名+小括号执行，函数上下文即为BOM【内置window对象】 function fun (){ //这个this即为函数上下文 console.log(this); } //如果是函数名+小括号调用函数上下文为window【所谓BOM对象】 fun();
-
-
函数作为事件处理函数执行
-
函数作为事件处理函数执行，函数的上下文即为触发事件的当前标签。
-
//获取div标签var div = document.getElementById("box");//绑定单击事件div.onclick = function(){ //函数体中上下文 this.style.background = "red";}
-
-
定时器回调函数执行
-
在JavaScript语言当中，定时为回调函数回每隔一段时间执行一次，而定时器回调函数上下文为window；
-
//定时器回调函数每隔一段事件执行一次 //第一个参数：函数（称之为回调函数） //第二个参数：是一个数字（代表的是定时器间隔）单位MS setInterval(function(){ console.log(this); },1500)
-
-
函数作为数组元素枚举出来执行
-
函数作为数组元素枚举出来执行，函数的上下文为当前数组。
-
var arr = [1,2,3,4,5,function(){ console.log("我是数组里面函数----我执行了"); this.reverse();},6,7,8,9,10];//枚举出函数执行arr[5]();console.log(arr);
-
-
函数作为对象方法执行
-
函数作为狭义对象方法执行，谁最后打点函数的上下文即为谁。
-
//狭义对象 var jch = { name:"贾成豪", age:18, sex:"男", eat:function(){ console.log(this.name+"我可以吃八级米饭"); } }//调用对象方法jch.eat();
-
-
-
总结：函数上下文五大规律
1：函数名+小括号执行=>window
2:函数作为事件处理函数执行=>当前触发这个事件标签
3：定时器回调函数每隔一段事件执行=>window
4:函数作为数组元素枚举出来执行=>当前数组
5：函数作为狭义对象方法执行=>最后打点对象
认识关键字new
-
关键字new其实也是调用函数另外一种方式。
-
/认知关键字new：它也是调用函数一种方式 //函数声明部分 function Fun (){ console.log("兄弟你执行呀"); } //关键字new 也是调用函数一种手段 new Fun; new Fun; new Fun;被new调用的函数才叫做构造函数。
构造函数：（用new调用与用函数名.()调用的区别，）
-
构造函数的两个特征
-
构造函数的首个英文字母一般大写（不是必要的）
-
如果函数是用new调用的，称之为构造函数。
-
function Fun (){ console.log(this);}new Fun;Fun();
-
两种方式调用，函数上下文是不一样的。用new调用时：- 第一步：在函数体中神秘创建了一个空的狭义对象【大的花括号】- 第二步:this指向当前这个空的狭义对象 - 第三步:可**以通过点语法给狭义对象动态添加属性、方法。**- 第四步：虽然没有关键字return，但是系统回自动将狭义对象返回 - ```javascript function People(){ //第一步：在函数体中神秘创建了一个空的狭义对象【大的花括号】 //第二步:函数体种上下文指向当前这个空的狭义对象 //第三步：可以通过点语法给狭义对象动态添加属性、方法 this.xingming = "小明"; this.age = 18; this.sex = "男"; this.hobby = ['吃饭','睡觉','打豆豆']; //第四步：虽然没有关键字return，但是系统回自动将狭义对象返回 } var obj = new People ``` ```javascript function Dog(name,sex,age){ this.name = name; this.sex = sex;//添加属性 this.age = age; this.getName = function () { console.log(name); };//添加方法 for(var i = 0 ; i < 10 ;i++){}; if(true){}; } var erha = new Dog("二哈","公",3); ``` 在前端工程师世界当中，构造函数就是所谓‘类’，通过四步走出来的狭义对象，称之为‘实例’。 原型链 prototype
-
任意构造函数天生都有一个prototype属性，指向一个空的狭义对象
-
实例天生拥有一个__proto__属性，向上面的狭义对象借用方法使用
//任意构造函数 天生都有一个 prototype属性 ，指向一个空的狭义对象 //创建出来的时候天生拥有一个__proto__属性，可以向上面的狭义对象借用方法使用 function Dog(name,age,sex){ //经历四步走 this.name = name; this.age = age; this.sex = sex; } //创建二哈实例 var erha = new Dog("二哈",18,"公"); var taidi = new Dog("太低",6,"母"); erha.yaoren(); taidi.yaoren() 
转载地址：http://ahtv.baihongyu.com/