K108
1.Array对象属性
2.定义和用法
3.push() 该方法可以向数组的末尾添加一个或多个元素,并返回数组的新的长度
1)可以将要添加的元素作为方法的参数传递
这些元素将自动添加到数组的末尾
<script>var arr = ["艾雅法拉","伊芙利特","安洁莉娜"];arr.push("澄闪");console.log(arr);</script>
<script>var arr = ["艾雅法拉","伊芙利特","安洁莉娜"];var result = arr.push("艾雅法拉","伊芙利特","安洁莉娜");arr.push("澄闪");console.log(arr);console.log("result ="+ result);//arr.pop();//console.log(arr);</script>
4.pop() 该方法可以删除数组的最后一个元素,并将删除的元素作为返回值返回
<script>var arr = ["艾雅法拉","伊芙利特","安洁莉娜"];//arr.push("澄闪");console.log(arr);arr.pop();console.log(arr);</script>
<script>var arr = ["艾雅法拉","伊芙利特","安洁莉娜"];//var result = arr.push("艾雅法拉","伊芙利特","安洁莉娜");//arr.push("澄闪");result = arr.pop();console.log(arr);console.log("result ="+ result);//arr.pop();//console.log(arr);</script>
5.unshift() 向数组开头添加一个或多个元素,并返回新的新组长度
<script>var arr = ["艾雅法拉","伊芙利特","安洁莉娜"];//var result = arr.push("艾雅法拉","伊芙利特","安洁莉娜");//arr.push("澄闪");//result = arr.pop();//console.log(arr);//console.log("result ="+ result);//arr.pop();//console.log(arr);console.log(arr);arr.unshift("焰影苇草");console.log(arr);</script>
6.shift() 可以是删除数组的第一个元素,并将被删除的元素作为返回值返回
<script>var arr = ["艾雅法拉","伊芙利特","安洁莉娜"];//var result = arr.push("艾雅法拉","伊芙利特","安洁莉娜");//arr.push("澄闪");//result = arr.pop();//console.log(arr);//console.log("result ="+ result);//arr.pop();//console.log(arr);console.log(arr);arr.unshift("焰影苇草");console.log(arr);result = arr.shift();console.log(arr);console.log("result = "+ result);</script>
K109
1.遍历数组
1)将数组中的所有元素都取出来
<script>var arr = ["玛恩纳","银灰","棘刺","山"];/*console.log(arr[0]);console.log(arr[1]);console.log(arr[2]);console.log(arr[3]);*/for(var i = 0; i < 10 ; i++){console.log(i);}</script>
<script>var arr = ["玛恩纳","银灰","棘刺","山"];/*console.log(arr[0]);console.log(arr[1]);console.log(arr[2]);console.log(arr[3]);*/for(var i = 0; i < 10 ; i++){console.log(arr[i]);}</script>
2)创建一个函数,可以将perArr满24岁的提取出来,再封装到一个新的数组返回
<script>/*var arr = ["玛恩纳","银灰","棘刺","山"];console.log(arr[0]);console.log(arr[1]);console.log(arr[2]);console.log(arr[3]);for(var i = 0; i < 10 ; i++){console.log(arr[i]);}*/var per = new Person("玛恩纳",45);var per2 = new Person("银灰",35);var per3 = new Person("棘刺",22);var per4 = new Person("山",23);var per5 = new Person("傀影",28);//将这些person对象放入到一个数组中var perArr = [per,per2,per3,per4,per5];function getwho(arr){var newArr = [];//遍历arr,获取arr中的person对象for(var i=0 ; i<arr.length; i++){var p = arr[i];//console.log(arr[i]);if(p.age >=18){//判断person对象的age是大于24//将对象放到新数组中newArr.push(p);}}//如果大于24,将其添加到newArr中//将新的数组返回return newArr;}var result = getwho(perArr);//console.log(result);</script>
K110
1.新的forEach遍历数组 (只支持IE8以上浏览器)
1)forEach()方法需要一个函数作为参数
2)像这种函数被称为回调函数(由我们创建但不是由我们调用)
注1:数组中有几个元素函数就会被调用几次
<script>var arr = ["玛恩纳","银灰","棘刺","山","傀影"];function fun(){}arr.forEach(function(){console.log("hello");});</script>
注2:每次执行时,浏览器会将遍历的所有元素以实参的形式传递过来
<script>var arr = ["玛恩纳","银灰","棘刺","山","傀影"];function fun(){}arr.forEach(function(a){//console.log("hello");console.log("a = "+a);});</script>
注3:浏览器会在回调函数中传递三个参数
第一个参数为当前遍历的函数,第二为遍历元素的索引,三为正在遍历的数组
K111
1.slice() 可以用来从数组中提取指定元素
1)语法:arrayObject.slice(start,end)
start:规定从何处开始选取,end:规定从何处开始结束
2)该方法不会改变元素数组,而是将截取到的元素封装到一个新的数组中返回
注1:第二个参数可以省略不写,此时截取从开始索引往后的所有元素
注2:索引可以传递一个负数,若传递一个负数,则从后往前计算
<script>var arr = ["玛恩纳","银灰","棘刺","山","傀影"];var result = arr.slice(0,2);//console.log(arr);console.log(result);</script>
2.splice() 可以用于删除数组中的指定元素
1)使用会影响到原数组,会将指定元素从原数组中删除
并将被删除的元素作为返回值返回
<script>var arr = ["玛恩纳","银灰","棘刺","山","傀影"];arr.splice(0,2);console.log(arr);</script>
2)参数 第一个表示开始位置的索引,第二表删除数量,三及以后可传递新元素
传递的新元素会自动插入到开始位置
K112
1)去除数组中的重复数字
<script>var arr = [1,2,3,2,1,3,4,2,5,];//去除数组中的重复数字//获取数组中的每一个元素for(var i=0; i<arr.length;i++){console.log(arr[i]);//获取元素后的所有元素for(var j=i+1; j<arr.length;j++){//console.log("---->"+arr[j]);//判断两个元素是否相等if(arr[i] == arr[j]){//若相等则证明出现了重复的元素,则删除j对应的元素arr.splice(j,1);}}}console.log(arr);</script>
2)优化,相邻较小数
<script>var arr = [1,2,3,2,2,1,3,4,2,5,];//去除数组中的重复数字//获取数组中的每一个元素for(var i=0; i<arr.length;i++){console.log(arr[i]);//获取元素后的所有元素for(var j=i+1; j<arr.length;j++){//console.log("---->"+arr[j]);//判断两个元素是否相等if(arr[i] == arr[j]){//若相等则证明出现了重复的元素,则删除j对应的元素arr.splice(j,1);//当删除了当前j所在的元素以后,后面的元素会自动补位//此时不会再比较这个元素,需要再比较一次j所在的位置//使j自减j--;}}}console.log(arr);</script>
55.K113
1.contact() 可连接两个或多个数组,并将新的数组返回
1)该数组不会对原数组产生影响
<script>var arr =["玛恩纳","银灰","棘刺"];var arr2 =["佐菲亚","初雪","艾丽妮"];arr.concat(arr2);console.log(arr);</script>
<script>var arr =["玛恩纳","银灰","棘刺"];var arr2 =["佐菲亚","初雪","艾丽妮"];var result = arr.concat(arr2);//console.log(arr);console.log(result);</script>
2)pro(加)
<script>var arr =["玛恩纳","银灰","棘刺"];var arr2 =["佐菲亚","初雪","艾丽妮"];var arr3 = ["霞光","临光"]var result = arr.concat(arr2,arr3,"铃兰");//console.log(arr);console.log(result);</script>
2.join() 该方法可以将数组转换为一个字符串
1)该方法不会对原数组产生影响,而是将转换后的结果作为返回值返回
<script>arr = ["玛恩纳","银灰","棘刺"];result = arr.join();console.log(result);</script>
2)可指定一个字符串作为参数,这个字符串会成为数组中元素的连接符
<script>arr = ["玛恩纳","银灰","棘刺"];result = arr.join("QAQ");console.log(result);</script>
3.reverse() 该方法用来反转数组(前去后,后去前)
1)该方法直接修改原数组
<script>arr = ["玛恩纳","银灰","棘刺"];result = arr.join("QAQ");//console.log(result);arr.reverse();console.log(arr);</script>
4.sort() 可以对数组进行排序
1)改变原数组,默认Unicode编码排序
<script>arr = ["b","d","e","a","c"];arr.sort()console.log(arr);</script>
2)纯数字数组仍然按Unicode编码排序
<script>arr = [3,4,11,2,5];arr.sort();console.log(arr);</script>
3)可自己指定排序顺序,在sort()添加一个回调函数,来指定排序规则
回调函数需要定义两个形参,浏览器将分别使用数组中的元素作为实参调用回调函数
浏览器会根据回调函数的返回值决定元素的顺序,返回>0值,元素交换。<=0值不变
注:逆序:1与-1换位
<script>arr = [5,4,7,6,1,2,3];arr.sort(function(a,b){//console.log("a = "+a);//console.log("b = "+b);if(a > b){return 1;}else if(a < b){return -1;}else{return 0;}});console.log(arr);</script>
4)升序排列(降序则是b - a)
<script>arr = [5,4,7,6,1,2,3];arr.sort(function(a,b){//console.log("a = "+a);//console.log("b = "+b);return a - b;});console.log(arr);</script>
K114
1.call() 和 apply
1)两者都是函数对象的方法,需要通过函数对象调用
<script>function fun(){alert("我是fun函数!");}fun.call();</script>
2)调用call和apply可以将一个参数指定为一个参数
注this:以函数形式调用时,this永远都是window
注this2:以方法形式调用时,this时调用方法的对象
注this3:以构造函数形式调用时,this是新创建的对象
注this4:使用call和apply调用时,this是指定的那个对象
K115
1)在调用函数时,浏览器每次会传递两个隐含的参数
注1:函数的上下文对象:this
注2:封装实参的对象 arguments
2)arguments是一个类数组对象,它可以通过索引来操作数据,也可以获取长度
<script>function fun(){console.log(Array.isArray());}fun();</script>
3)在调用函数时,我们所传递的实参都会在arguments中保存
<script>function fun(){//console.log(Array.isArray());console.log(arguments.length);}fun();</script>
4)arguments.length可以用来获取实参的长度
<script>function fun(){//console.log(Array.isArray());console.log(arguments.length);}fun("hello",true);</script>
5)我们即使不定义形参,也可以通过arguments来使用实参
arguments[0] 表示第一个实参
arguments[1] 表示第二个实参
<script>function fun(){//console.log(Array.isArray());//console.log(arguments.length);console.log(arguments[1]);}fun("hello",true);</script>
K116
1.在JS中使用Date对象来表示一个时间
1)直接使用构造函数创建一个Date对象,会封装当前代码执行时的时间
<script>var d = new Date();console.log(d);</script>
2)创建一个指定的时间对象,在构造函数中传递一个表示时间的字符串作为参数
注:日期的格式:月份/日/年 时:分:秒
<script>var d = new Date();var d2 = new Date("12/03/2022");console.log(d2);</script>
2.getDate() 获取当前日期对象是几日
<script>var d = new Date();var d2 = new Date("12/03/2022 12:27:30");var date =d2.getDate();//console.log(d2);console.log("date = "+date);</script>
3.getDay() 获取当前日期对象是周几
注:返回0-6, 0表示周日,1表示周一
<script>var d = new Date();var d2 = new Date("12/03/2022 12:27:30");var day =d2.getDay();//console.log(d2);//console.log("date = "+date);console.log("day = "+day);</script>
4.getMonth() 获取当前日期对象的月份
注:返回0-11, 0表示1月,11表示12月
<script>var d = new Date();var d2 = new Date("12/03/2022 12:27:30");var day =d2.getDay();var month = d2.getMonth();//console.log(d2);//console.log("date = "+date);//console.log("day = "+day);console.log("month = "+month);</script>
5.getFullYear() 获取当前日期对象的年份
<script>var d = new Date();var d2 = new Date("12/03/2022 12:27:30");var day =d2.getDay();var month = d2.getMonth();var year = d2.getFullYear();//console.log(d2);//console.log("date = "+date);//console.log("day = "+day);//console.log("month = "+month);console.log(year);</script>
6.getTime() 获取当前日期对象的时间戳
注:时间戳:指从格林威治标准时间的1970.1.1 0:0:0到当前时期的毫秒数
<script>var d = new Date();var d2 = new Date("12/03/2022 12:27:30");var day =d2.getDay();var month = d2.getMonth();var year = d2.getFullYear();var time = d2.getTime();//console.log(d2);//console.log("date = "+date);//console.log("day = "+day);//console.log("month = "+month);//console.log(year);console.log(time);</script>
7.获取时间戳
time = Date.now();
K117
1)Math和其他对象不同,它不是一个构造函数
属于一个工具类不用创造对象,它里面封装了数学运算相关的属性和方法
2)Math.PI表示圆周率
3)abs()可以计算一个数的绝对值
4)Math.ceil()可以对一个数进行向上取整,有小数位则自动进1
5)Math.floor()可以进行向下取整,小数部分被舍掉
6)Math.round()可以对一个数进行四舍五入取整
7)Math.random()可以生成一个0-1之间的随机数
生成0-10,则Math.random()*10
生成0-x,则Math.random()*x
生成1-10,则(Math.random()*9)+1
生成x-y,则(Math.random( ) * (y-x)+x)
8)max()可以获取多个数中的最大值,min()最小值
9)Math.pow(x,y)返回x的y次幂
10)Math.sqrt()用于对一个数进行开方运算
K118
1.JS中提供了三个包装类,通过这三个包装类可以将基本数据类型的数据转为对象
1)三个:String(转换为string对象) Number(n…) Boolean(b…)
2)方法和对象只能添加给对象,不能添加给基本数据类型
3)当我们对一些基本数据类型的值去调用属性和方法
浏览器会临时使用包装类将其转换为对象,然后再调用对象和方法
调换之后会将其转换为基本数据类型
K119
1)底层字符串是以字符数组的形式保存的
2)length属性可以获取字符串长度
<script>var str ="Hello Atguigu";console.log(str.length);</script>
<script>var str ="Hello Atguigu";console.log(str[6]);</script>
3)charAt()可以返回字符串中指定位置的字符,根据索引获取
4)charCodeAt() 可以获取指定位置的字符编码(unico编码)
5)String.formCharCode()可以根据字符编码去获取字符
6)concat() 可以用来连接两个或多个字符串
7)indexof() 可以检索一个字符中是否含有指定内容
若有,则返回其第一次出现的索引
若无,则返回-1
可指定一第二个参数,指定开始查找的位置 result = str.indexof(“X”,x);
8)lastIndexof() 同上,但从后往前找
9)slice() 可从字符串中截取指定的内容,不影响原字符串,将截取内容返回
参数:第一个,开始位置索引(包括开始位置) 第二个,结束…(不包括)
若省略第二个数,则会截取后面所有的
也可传递一个负数,表现形式为从后向前
10)substring() 可用来截取一个字符串,与slice()类似
参数:第一个,开始位置索引(包括开始位置) 第二个,结束…(不包括)
不同的是,不能接受赋值,传递默认为0
它还可以自动调整参数的位置,若二<一,则自动交换
11)substr() 用来截取字符串或截取的长度
12)split()可以将一个字符串拆分为一个数组
需要一个字符串作为参数,将会根据该字符串去拆分数组
如果传递为一个空串作为参数,则会将每个字符拆分为数组中的一个元素
13)toUpperCase()将一个字符串转换为大写并返回
K120
1.正则表达式
1)邮件的规则
a.前面可以是xxxx之类的
b.后面跟着一个@
c.后面可以是xxxx
d. .com或其他
2)正则表达式用于定义一些字符串的规则
计算机可根据正则表达式,来检查一个字符串是否符合规则
获取将字符串中符合规则的内容提取出来
3)var 变量 = new RegExp(“正则表达式”,“匹配模式”)
4)test()使用这个方法可以用来检查一个字符串是否符合正则表达式的规则
符合返回true,否则返回false
5)在构造函数中可以传递一个匹配模式作为第二个参数
可以是i 忽略大小写 g 全局匹配模式
K121
1.使用字面量来创建正则表达式
1)语法:var 变量 = /正则表达式/匹配模式
注:使用构造函数更加灵活,字面量更简单
<script>/*var str ="Hello Atguigu";console.log(str[6]);*/var reg = new RegExp("a","i");reg = /a/i;console,log(typeof reg);console.log(reg.test("abc"));</script>
2)| 与 [] 或
reg = /a|b|c|d|e|f|g/;reg = /[abcdefg]/
注:a-z在[]表示a到z
K122
1)split() 可以将一个字符串拆分为一个组
可传递一个正则表达式作为参数,这样方法将会根据正则表达式去拆分字符串
2)search() 可以搜索字符串中是否含有指定内容
若有,则返回其第一次出现的索引
若无,则返回-1
可以接受一个正则表达式作为参数,然后会根据正则表达式去检索字符串
3)match()可以根据正则表达式,从一个字符串中将符合条件的内容提取出来
默认情况下我们的match只会找到一个符合这种要求的内容,找到后停止
我们可以设置正则表达式为全局匹配模式,这样就会匹配到所有的内容
可以为一个正则表达式设置多个匹配模式,且顺序无所谓
match()会将匹配到的内容封装到一个数组中返回,即使只查询到一个结果
4)replace() 可以将字符串中指定内容替换为新的内容
参数:1.被替换的内容,可以接受一个正则表达式作为参数 2.新的内容
默认只会替换一个
result = str.replace("a","QAQ");
K123
1)量词
注1:通过量词可以设置一个内容出现的次数 {n}正好出现n次
量词只对它前面的一个内容起作用
{m-n}:出现m-n次(m到n)
{m,} :m次以上
+ :至少一个,相当于{1,}
* :0个或多个,相当于{0,}
? :0个或1个,相当于{0,1}
^ :表示开头
$ :表示结尾
注2:在正则表达式中使用^&要求字符串必须完全符合正则表达式
<script>var reg = /a{3}/;console.log(reg.test("aaabc"));</script>
K124
1). :表示任意字符
2)在正则表达式中使用\作为转义字符
3)用\ .表示.
4)用\ \表示斜杠
5)\ w :任意字母、数字、_ [A-Z 0-9_]
6)\ W:除了字母、数字、_ [ ^A-Z 0-9_ ]
7)\ d :任意的数字[0-9]
8)\ D :除了数字[^0-9]
9)\ s :空格
10)\ S :除了空格
11)\ b :单词边界
12)\ B :除了单词边界
K125
1.要求
1)尝试
<script>var emaiReg = /\w{3,}(\.\w+)*@[A-z0-9]+(\.[A-z]{2,5}){1,2}/;var email = "abc@abc.com";console.log(emaiReg.test(email));</script>
K126
1.JS中的数据:
1)String 字符串
2)Number 数值
3)Boolean 布尔值
4)Null 空值
5)Undefined 未定义
6)Object 对象
A.基本数据类型为单一值
a.示例:在JS中表示一个人的信息(name gender age)
var name = "焰影苇草";var gender = "女";var age = "18";
注:使用基本数据类型的数据,所创建的变量都是独立的,不能成为一个整体
B.对象属于一种复合类型
a.在对象中可以保存多个不同数据类型的属性
2.对象的分类
a.内建对象:由ES标准中定义的对象,在任何的ES的实现中都可以使用
如Math String Number Boolean Function Object…
b.宿主对象:由JS的运行环境提供的对象,目前主要指由浏览器提供的对象
如BOM(浏览器对象模型) DOM(文档对象模型)
c.自定义对象:由开发人员自己创建的对象
K127
1.构造函数
var obj = new Object();
注:使用new关键字调用的函数,是构造函数constructor,它专门用来创建对象
1)向对象中添加属性(在对象中保存的值称为属性)
语法:对象.属性名 = 属性值;
例1:向obj中添加一个name属性:
var obj = new Object();obj.name = "焰影苇草";
例2:再向obj中添加一个gender、age属性:
var obj = new Object();obj.name = "焰影苇草";obj.gender = "女";obj.age = "18";
2)读取对象中的属性
语法:对象.属性名 ;
<script>var obj = new Object();obj.name = "焰影苇草";obj.gender = "女";obj.age = "18";console.log(obj);console.log(obj.name);console.log(obj.gender);console.log(obj.age);</script>
3)修改对象的属性值
语法:对象.属性名 = 新值 ;
4)删除对象的属性
语法:delete 对象.属性名 ;
K128
1.属性名
1)对象的属性名不强制要求遵守标识符的规范
2)使用特殊的属性名(如数字) 语法:对象[“属性名”] = 属性值,读取同形
注:使用[]这种形式去操作属性,更加的灵活,在[]中可以直接传递一个变量
var obj = new Object;obj["123"] = 789;var n = "123";console.log(obj[n]);//console.log(obj["123"]);
2.属性值
1)JS对象的属性值,可以是任意的数据类型,甚至也可以是一个对象(层层套)
<script>var obj2 = new Object;obj2.name = "焰影苇草";obj.test = obj2;console.log(obj.test.name)</script>
3.in 运算符
1)通过该运算符可以检查一个对象中是否含有指定的属性,有->true 无->false
2)语法:“属性名” in 对象;
K129
1.探究基本类型与引用类型的区别
1)基本数据类型
<script>var a = 123;var b = a;a++;console.log("a = " + a);console.log("b = " + b);</script>
2)引用数据类型(原)
<script>var obj = new Object;obj.name = "焰影苇草";var obj2 = obj;console.log(obj.name);console.log(obj2.name);</script>
3)修改属性名(现)
<script>var obj = new Object;obj.name = "焰影苇草";var obj2 = obj;//修改obj的name属性obj.name = "法伤十万大C";console.log(obj.name);console.log(obj2.name);</script>
A.JS中的变量都是保存到栈内存中
a.基本数据类型的值直接在栈内存中存储
b.值与值之间是独立存在的,修改一个变量不会影响到其他的变量
c.对象是保存在堆内存中的
d.每创建一个新的对象,就会在堆内存中开辟一个新的空间,而变量保存的是对象的内存地址(对象的引用)
e.如果两个变量保存的是同一个对象引用,当一个通过变量修改时,另一个也会收到影响
4)修改属性值
<script>var obj = new Object;obj.name = "焰影苇草";var obj2 = obj;//修改obj的name属性obj.name = "法伤十万大C";//设置obj2为nullobj2 = null;console.log(obj);console.log(obj2);</script>
5)基本数据类型与引用数据类型的属性同否
<script>var c = 10;var d = 10;console.log(c == d);var obj3 = new Object;var obj4 = new Object;obj3.name = "凯尔希";obj4.name = "M3发射器";console.log(obj3 == obj4);</script>
B.比较类型值
a.比较两个引用数据类型时,是比较对象的内存地址,地址不同返回false
K130
1.使用对象字面量来创建一个对象
1)一般形式: var obj = new Object();
2)使用字面量:var obj = { };
注:使用对象字面量,创建对象时可以直接指定对象中的属性
3)语法:{属性名:属性值,属性名:属性值…}
<script>var obj = {name:"焰影苇草",gender:"女"};console.log(obj);</script>
注:对象字面量属性名可加引号也可不加,建议不加;若要使用特殊名,必须加
31.函数 Function(也是对象)(K51)
1.作用:函数中可以封装一些功能(代码),在需要时可以执行这些功能(代码)
2.创建一个函数对象
1)可以将要封装的代码以字符串的形式传递给构造函数
<script>var fun = new Function("console.log('第一个函数');");console.log(fun);</script>
2)调用函数 语法:函数对象();
<script>var fun = new Function("console.log('第一个函数');");//console.log(fun);fun();</script>
注:封装到函数中的代码不会立即执行,仅储存,函数中的代码会在函数调用时执行
当调用函数时,函数中封装的代码会按照顺序执行
在实际开发中很少使用构造函数来创建一个函数对象
3.使用 函数声明 来创建一个函数
1)语法:function 函数名([形参1,形参2…形参N]){
语句…
}
<script>function fun2(){ console.log("第二个函数");alert("嘤嘤嘤嘤嘤");document.write("┭┮﹏┭┮");}console.log(fun2);fun2();</script>
4.使用 函数表达式 来创建一个函数
1)语法:var 函数名 = function([形参1,形参2…形参N]){
语句…
}
K131
1.定义一个求两个数和的函数
<script>function sum(){console.log(54+99);}sum();</script>
1)可以在函数的()中来指定一个或多个形参,多个形参用,
隔开
2)在调用函数时,可以在()中指定实参
3)调用函数时解析器不会检查实参的类型(块块显示),但true和false显示1和0
4)多于的形参不会被赋值
5)若实参数少于形参数,则没有对应实参的形参显示undefined
<script>function sum(a,b){console.log(a+b);}sum(55,99);</script>
K132
1.return
1)可以使用 return 来设置函数的返回值
2)语法:return 值;
3)return后的值将会作为函数的执行结果返回
4)在函数return后的语句都不会执行
5)若return语句后面不跟如何值就相当于返回一个undefined,若不写re也返回un
<script>function sum(a,b,c){var d = a + b + c;return d;}var result = sum(4,5,6);console.log("result = "+result);</script>
K133
1.定义一个函数,判断一个数字是否为偶数,是返true,否返false
1)原写
<script>function isOu(num){if(num % 2 == 0){return true;}else{return false;}}var result = isOu(2);console.log("result = "+ result);</script>
2)优化(震惊)
<script>function isOu(num){return num % 2 == 0;}var result = isOu(2);console.log("result = "+ result);</script>
2.定义一个函数,可根据半径计算一个圆的面积,并返回计算结果
<script>function S(r){return 3.14*r*r;}result = S(4);console.log("result ="+ result);</script>
3.创建一个函数,可以在控制台中输出一个人的信息
1)原写
<script>function hi(name,age,gender,address){console.log("我是" + name + ",今年" + age + "岁," + "性别" + gender + ",住在" + address);}hi("王维纳","19","女","维多利亚");</script>
2)简化(以对象为参数,修改属性)
<script>function hi(o){console.log("我是" + o.name + ",今年" + o.age + "岁," + "性别" + o.gender + ",住在" + o.address);}var obj = {name:"王维纳",age:"19",gender:"女",address:"维多利亚"}hi(obj);</script>
K134
1.使用括号使语句成为一个整体
1)错句不报错
<script>(function(){alert("我是一个匿名函数~~~");})</script>
2)网页显示(alert作用显示)
<script>(function(){alert("我是一个匿名函数~~~");})();</script>
3)它变
<script>(function(a,b){console.log("a ="+ a);console.log("b ="+ b);})(123,456);</script>
K135
1.对象补充
1)属性值可以是任何数据类型,也可以是函数
<script>//创建一个对象var obj = new Object();//向对象中添加属性obj.name = "菲亚梅塔";obj.age ="21";//对象的属性值可以是任何的数据类型,也可以是个函数obj.sayName = function(){console.log(obj.name);}//3) console.log(obj.sayName);//1)显示{}内全内容obj.sayName();</script>
2)函数也可称为对象的属性
若一个函数作为一个对象的属性保存,那么我们称这个函数是这个对象的方法
调用这个函数就说调用对象的方法,只是名称上的区别
2.枚举对象中的属性
1)for … in 语句
语法:for(var 变量 in 对象){ }
注1:for … in语句 对象中有几个属性,循环体就会执行几次
<script>var obj ={name:"菲亚梅塔",age:"21",gender:"女"};for(var n in obj){console.log("苦难陈述者");}</script>
注2:每次执行时,会将对象中的一个属性的名字赋值给变量
<script>var obj ={name:"菲亚梅塔",age:"21",gender:"女"};for(var n in obj){console.log(n);}</script>
稍微变化(【】传变量)
<script>var obj ={name:"菲亚梅塔",age:"21",gender:"女"};for(var n in obj){console.log(obj[n]);}</script>
K136
例.域外:
<script>function fun(){var a = 123;}fun();console.log(a);</script>
1.作用域:指一个变量的作用范围(JS中有两种作用域)
A.全局作用域
1)直接编写在script标签中的JS代码,都在全局作用域
2)全局作用域在页面打开时创建,在页面关闭时销毁
3)全局作用域中有一个全局对象Window,它代表一个浏览器的窗口
a.Window由浏览器创建我们可以直接使用
4)全局作用域中,创建的对象都会作为Window对象的属性保存
5)全局作用域中,创建的函数都会作为Window对象的方法保存
6)全局作用域中的变量都是全局变量,在页面任意部分都可以访问到
B.函数作用域(部分作用域)
1)调用函数时创建函数作用域,函数执行完毕后,函数作用域销毁
2)每调用一次就会创建一个新的函数作用域,他们之间互相独立
<script>//创建一个变量var a = 10;function fun(){console.log("a = "+ a);}fun();</script>
3)在函数作用域中可以访问到全局作用域的变量
4)在全局作用域中无法访问到函数作用域的变量
<script>//创建一个变量var a = 10;function fun(){var b = 20;console.log("a = "+ a);}fun();console.log("b = "+ b);</script>
5)当在函数作用域操作一个变量时,它会先在自身作用域中寻找
有则直接使用,无则向上一级作用域中寻找,直到找到全局作用域
<script>//创建一个变量var a = 10;function fun(){var a = "我是函数中的变量a";console.log("a = "+ a);}fun();console.log("a = "+ a);</script>
6)如果全局作用域中依然没有找到,则会报错ReferenceError
<script>//创建一个变量var a = 10;function fun(){var a = "我是fun函数中的变量a";function fun2(){console.log("a = "+ a);}fun2();}fun();//console.log("a = "+ a);</script>
7)在函数中要访问全局变量可以使用window对象
<script>//创建一个变量var a = 10;function fun(){var a = "我是fun函数中的变量a";function fun2(){console.log("a = "+ window.a);}fun2();}fun();//console.log("a = "+ a);</script>
8)在函数作用域中也有声明提前的特性
使用var关键字声明的变量,会在函数中所有的代码执行前被声明
<script>function fun3(){console.log(a);var a =35;}fun3();</script>
9)函数声明也会在函数中所有的代码执行之前执行
<script>function fun3(){fun4();var a =35;function fun4(){alert("I`m fun4");}}fun3();</script>
10)在函数中,不使用var声明的变量会变为全局变量
<script>var c =33;function fun5(){//console.log("c = "+c);c = 10; }fun5();//在全局输出cconsole.log("c = "+ c);</script>
2.变量的声明提前
<script>//a = 123;var a = 123;//相当于Window.a = 123;console.log("a = " +a);</script>
1)使用var关键字声明的变量,会在所有的代码执行之前被声明(但不会被赋值)
<script>console.log("a = " +a);var a = 123;</script>
2)若声明变量时不使用var关键字,则变量不会被提前声明
<script>console.log("a = " +a);a = 123;</script>
3)函数声明提前(fun2形式为函数表达式,会被提前声明,但未被赋值)
<script>fun();fun2();//函数声明,会被提前创建function fun(){console.log("伊比利亚至高之术");}//函数表达式,不会被提前创建var fun2 = function(){console.log("多索雷斯至高之术");};</script>
a.使用函数声明形式创建的函数function 函数(){ },会在所有代码执行之前被创建
b.所以可以在函数声明前调用函数
c.使用函数表达式创建的函数,不会被声明提前,使用不能在声明前调用
K137-K140
1.隐含的参数
1)解析器在调用函数每次都会向函数内部传递进一个隐含的参数
<script>function fun(a,b){console.log("a = " + a + "b = " + b);}fun(123,456);</script>
2)这个隐含的参数就是this,this指向的是一个对象
这个对象我们称为函数执行的上下文对象
<script>function fun(a,b){//console.log("a = " + a + "b = " + b);console.log(this);}fun(123,456);</script>
3)根据函数的调用方式的不同,this会指向不同的对象
<script>function fun(a,b){//console.log("a = " + a + "b = " + b);console.log(this);}fun();var obj = {name:"号角",sayName:fun};console.log(obj.sayName == fun);</script>
4)以函数形式调用时,this永远都是window
<script>function fun(a,b){//console.log("a = " + a + "b = " + b);console.log(this);}//fun();var obj = {name:"号角",sayName:fun};//console.log(obj.sayName == fun);//obj.sayName();fun();</script>
5)以方法的形式调用时,this就是调用的方法
<script>function fun(a,b){//console.log("a = " + a + "b = " + b);console.log(this);}//fun();var obj = {name:"号角",sayName:fun};//console.log(obj.sayName == fun);obj.sayName();</script>
K141-K145
1.看看吧,敲的挺累的,脑子也麻了
<script>//创建一个name变量var name = "全局";//创建一个fun()函数function fun(){console.log(name);}//创建两个对象var obj ={name:"焰影苇草",sayName:fun};var obj2 ={name:"深池",sayName:fun};fun();</script>
<script>//创建一个name变量var name = "全局";//创建一个fun()函数function fun(){console.log(name);}//创建两个对象var obj ={name:"焰影苇草",sayName:fun};var obj2 ={name:"深池",sayName:fun};//fun();//我们希望调用obj。sayName()时可以输出obj的名字obj.sayName();</script>
<script>//创建一个name变量var name = "全局";//创建一个fun()函数function fun(){console.log(obj.name);}//创建两个对象var obj ={name:"焰影苇草",sayName:fun};var obj2 ={name:"深池",sayName:fun};//fun();//我们希望调用obj。sayName()时可以输出obj的名字obj.sayName();</script>
<script>//创建一个name变量var name = "全局";//创建一个fun()函数function fun(){console.log(this.name);//替换了this}//创建两个对象var obj ={name:"焰影苇草",sayName:fun};var obj2 ={name:"深池",sayName:fun};//fun();//我们希望调用obj。sayName()时可以输出obj的名字obj2.sayName();//2)在替换this之后,替换obj/obj2可显示不同的name</script>
K146-K147
1)初始
<script>var obj ={name:"假日威龙陈",age:25,gender:"女",sayName:function(){alert(this.name);} };obj.sayName();</script>
2)叠变
<script>var obj ={name:"假日威龙陈",age:25,gender:"女",sayName:function(){alert(this.name);} };var obj2 ={name:"星熊",age:28,gender:"女",sayName:function(){alert(this.name);} };var obj3 ={name:"羽毛笔",age:18,gender:"女",sayName:function(){alert(this.name);} };obj3.sayName();</script>
3)使用工厂方法创建对象
<script>function createPerson(name,age,gender){//创建一个新的对象var obj = new Object();//向对象中添加属性obj.name = name;obj.age = age;obj.gender = gender;obj.sayName = function(){alert(this.name);};//将新的对象返回return obj;}var obj2 = createPerson("假日威龙陈",25,"女");var obj3 = createPerson("星熊",28,"女");var obj4 = createPerson("羽毛笔",18,"女");console.log(obj2);console.log(obj3);console.log(obj4);</script>
K147-K150
1)其他类
<script>function createPerson(name,age,gender){//创建一个新的对象var obj = new Object();//向对象中添加属性obj.name = name;obj.age = age;obj.gender = gender;obj.sayName = function(){alert(this.name);};//将新的对象返回return obj;}function createDog(name,age){var obj = new Object();obj.name = name;obj.age = age;obj.sayHello = function(){alert("汪汪~~~");};return obj;}var obj2 = createPerson("假日威龙陈",25,"女");var obj3 = createPerson("星熊",28,"女");var obj4 = createPerson("羽毛笔",18,"女");console.log(obj2);console.log(obj3);console.log(obj4);//创建一个狗的对象var dog = createDog("旺财",3);dog.sayHello();</script>
注:使用工厂方法创建的对象,使用的构造函数都是object,所以创建的对象都是object
1.构造函数
1)构造函数就是一个普通的函数,创建方式和普通函数没有区别
不同的是构造函数习惯上首写字母大写
2)构造函数和普通函数的区别就是调用方式的不同
普通函数就是直接调用,而构造函数需要使用new关键字来调用
<script>//创建一个构造函数,专门用来创建Person对象function Person(){}var per = new Person();console.log(per);</script>
3)构造函数的执行流程:
a.立刻创建一个新的对象
b.将新建的对象设置为函数中的this,在构造函数中可以使用this来引用新建的对象
c.逐行执行函数中的代码
d.将新建对象作为返回值返回
<script>//创建一个构造函数,专门用来创建Person对象function Person(){this.name = "安洁莉娜";}var per = new Person();console.log(per.name);</script>
<script>//创建一个构造函数,专门用来创建Person对象function Person(name,age,gender){this.name = name;this.age = age;this.gender = gender;this.sayName = function(){alert(this.name);};}var per = new Person("安洁莉娜",17,"女");var per2 = new Person("玛恩纳",45,"男");var per3 = new Person("银灰",35,"男");console.log(per);console.log(per2);console.log(per3);</script>
<script>//创建一个构造函数,专门用来创建Person对象function Person(name,age,gender){this.name = name;this.age = age;this.gender = gender;this.sayName = function(){alert(this.name);};}function Dog(){}var per = new Person("安洁莉娜",17,"女");var per2 = new Person("玛恩纳",45,"男");var per3 = new Person("银灰",35,"男");var dog = new Dog();console.log(per);//console.log(per2);//console.log(per3);console.log(dog);</script>
注:使用同一类构造函数创建的对象,称之为一类对象,也将一个构造函数称为一个类
我们将通过一个构造函数创建的对象,称为该类的实例
4)使用instanceof可以检查一个对象是否为一个类的实例
语法:对象 instanceof 构造函数
若是,返回true,否则返回false
console.log(per instanceof Person);
5)所有的对象都是object的后代
所以任何对象和object做instanceof检查时都会返回true
注1:当以函数的形式调用时,this是window
注2:当以方法的形式调用时,谁调用方法this就是谁
注3:当以构造函数的形式调用时,this就是新创建的那个对象
K151-K153
1.又是例题
<script>//创建一个Person函数function Person(name , age , gender){this.name = name;this.age = age;this.gender = gender;//向对象中添加方法this.sayName = function(){alert("Hello大家好,我是"+ this.name);};}//创建一个person的实例var per = new Person("玛恩纳",45,"男");per.sayName();</script>
1)在创建的person函数中,为每个对象都添加了一个sayName方法
目前我们的方法是在构造函数的内部创建的
也就是构造函数每执行一次就会创建一个新的sayName方法
也就是所有实例的sayName都是唯一的
<script>//创建一个Person函数function Person(name , age , gender){this.name = name;this.age = age;this.gender = gender;//向对象中添加方法this.sayName = function(){alert("Hello大家好,我是"+ this.name);};}//创建一个person的实例var per = new Person("玛恩纳",45,"男");var per2 = new Person("银灰",35,"男");//per.sayName();//per2.sayName();console.log(per.sayName == per2.sayName);</script>
2)使一万种方法变为一种
<script>//创建一个Person函数function Person(name , age , gender){this.name = name;this.age = age;this.gender = gender;//向对象中添加方法this.sayName = fun;}//将sayName方法在全局作用域中定义//将sayName方法在全局作用域中定义//将函数定义在全局作用域污染了全局作用域的命名空间,且定义在全局作用域也很不安全function fun(){alert("Hello大家好,我是"+ this.name);};//创建一个person的实例var per = new Person("玛恩纳",45,"男");var per2 = new Person("银灰",35,"男");//per.sayName();//per2.sayName();console.log(per.sayName == per2.sayName);</script>
K154-K156
1.原型prototype
1)我们所创建的每一个函数,解析器都会向函数中添加一个属性prototype
这个属性对应一个对象,这个对象就是原型对象
<script>function Person(){}console.log(Person.prototype);</script>
2)二维表现
3)若函数作为普通函数调用prototype没有任何作用
当函数通过构造函数形式调用时,它所创建的对象中都会有一个隐含的属性
指向该构造函数的原型对象,可以通过__proto__属性访问
<script>function Myclass(){}var mc = new Myclass();//console.log(Person.prototype);console.log(mc.__proto__);</script>
4)原型对象相当于一个公共的区域,使用同一个类的实例都可访问这个原型对象
我们可以将对象中共有的内容,统一设置到原型对象中
当访问一个对象的属性或方法时,它会先在对象自身中寻找,有则直接使用
无则去原型对象中寻找,找到则直接使用
<script>function Myclass(){}//向Myclass的原型中添加属性值Myclass.prototype.a = 123;var mc = new Myclass();var mc2 = new Myclass();//console.log(Person.prototype);console.log(mc.a);</script>
<script>function Myclass(){}//向Myclass的原型中添加属性值Myclass.prototype.a = 123;//向Myclass的原型中添加一个方法 Myclass.prototype.sayHello = function(){alert("hello");} var mc = new Myclass();var mc2 = new Myclass();//console.log(Person.prototype);//console.log(mc.a);//向mc中添加a属性mc.a = "我是mc中的a";mc.sayHello();</script>
K157
1)原
<script>//创建一个构造函数function Myclass(){}var mc = new Myclass();console.log(mc.name);</script>
2)向Myclass的原型中添加一个name属性
in检查对象原型中含有某属性,若对象中无但原型有,返回true
<script>//创建一个构造函数function Myclass(){}//向Myclass的原型中添加一个name属性Myclass.prototype.name = "我是原型的名字";var mc = new Myclass();console.log(mc.name);console.log("name"in mc);</script>
3)可以使用hasOwnProperty()来检查对象自身中是否含有该属性
使用该方法只有当对象自身含有属性时,才会返回true
<script>//创建一个构造函数function Myclass(){}//向Myclass的原型中添加一个name属性Myclass.prototype.name = "我是原型的名字";var mc = new Myclass();//console.log(mc.name);//console.log("name"in mc);//可以使用hasOwnProperty()来检查对象自身中是否含有该属性console.log(mc.hasOwnProperty("name"));</script>
<script>//创建一个构造函数function Myclass(){}//向Myclass的原型中添加一个name属性Myclass.prototype.name = "我是原型的名字";var mc = new Myclass();//console.log(mc.name);//console.log("name"in mc);//可以使用hasOwnProperty()来检查对象自身中是否含有该属性//console.log(mc.hasOwnProperty("name"));console.log(mc.hasOwnProperty("hasOwnProperty"));console.log(mc.__proto__.hasOwnProperty("hasOwnProperty"));</script>
4)原型对象也是对象,它也有原型
当我们使用一个对象的属性或方法时,会在自身中寻找
自身中美元,则直接使用
如果没有则去原型中寻找,如果原型对象中有,则使用
如果没有则去原型的原型中寻找
<script>//创建一个构造函数function Myclass(){}//向Myclass的原型中添加一个name属性Myclass.prototype.name = "我是原型的名字";var mc = new Myclass();//console.log(mc.name);//console.log("name"in mc);//可以使用hasOwnProperty()来检查对象自身中是否含有该属性//console.log(mc.hasOwnProperty("name"));//console.log(mc.hasOwnProperty("hasOwnProperty"));//console.log(mc.__proto__.hasOwnProperty("hasOwnProperty"));console.log(mc.__proto__.__proto__.hasOwnProperty("hasOwnProperty"));</script>
K158
1)淳朴开头
<script>function Person(name , age , gender){this.name = name;this.age = age;this.gender = gender;}//创建一个person实例var per = new Person("玛恩纳",45,"男");console.log(per);</script>
2)在页面上打印一个对象时,实际上是输出对象的toString()方法返回值
<script>function Person(name , age , gender){this.name = name;this.age = age;this.gender = gender;}//创建一个person实例var per = new Person("玛恩纳",45,"男");var result = per.toString();console.log("result =" + result);</script>
3)如果希望输出对象不输出【object object】,可为对象添加tostring()方法
<script>function Person(name , age , gender){this.name = name;this.age = age;this.gender = gender;}//创建一个person实例var per = new Person("玛恩纳",45,"男");per.toString = function(){ return"我是一个快乐的小person";}var result = per.toString();console.log("result =" + result);</script>
K159
1.需要一个垃圾回收机制来处理程序运行过程中产生的垃圾
2.当一个对象没有任何的变量或属性对它引用,我们将永远无法操作该对象,它是垃圾
这种对象会占用大量的内存,导致程序运行变慢
3.在JS中拥有自动的垃圾回收机制,会自动将这些垃圾对象从内存中销毁
我们不需要也不能进行垃圾回收的操作
K160
1.对象:内建对象、宿主对象、自定义对象(*)
2.数组(Array)
1)数组也是一个对象,也是用来存储对象
2)但普通对象用字符串作为属性名,数组使用数字作为索引操作元素
3)索引:从0开始的整数就是索引
4)使用数组:数组的存储性能比普通对象好
5)创建数组对象
<script>//创建数组对象var arr = new Array();</script>
6)向数组中添加元素 语法:数组[索引] = 值
<script>//创建数组对象var arr = new Array();arr[0] = 10;arr[1] = 33;console.log(arr);</script>
6)读取数组中的元素 语法:数组[索引]
<script>//创建数组对象var arr = new Array();arr[0] = 10;arr[1] = 33;console.log(arr[0]);</script>
7)获取数组的长度(元素的个数)语法:数组.length
<script>//创建数组对象var arr = new Array();arr[0] = 10;arr[1] = 33;console.log(arr.length);</script>
8)对于连续数组,使用length可以获取数组的长度(元素个数)
对于非连续数组,使用length会获取到数组的最大的索引+1
9)修改length,若修改的length大于原长度,多于部分会空出来
若小于原长度,则多出的元素被删除
<script>//创建数组对象var arr = new Array();arr[0] = 10;arr[1] = 33;arr[2] = 22;arr[10] = 31;arr[100] = 90;console.log(arr.length);console.log(arr);//修改lengtharr.length = 10;console.log(arr.length);console.log(arr);</script>
10)向数组的最后一个位置添加元素 语法:数组[数组.length]
K161
1)使用字面创建一个数组时,创建时就可以指定数组中的元素
<script>//创建一个数组//var arr = new Array();//使用字面量来创造数组//var arr = [];var arr = [1,2,3,4,5,10];console.log(arr);</script>
2)使用构造函数创建数组时,也可以添加元素
要将添加的元素作为构造函数的参数传递,元素之间使用,隔开
<script>//创建一个数组//var arr = new Array();//使用字面量来创造数组//var arr = [];var arr = [1,2,3,4,5,10];//console.log(arr);var arr2 = new Array(10,20,30);//console.log(arr2);//创建一个数组,数组中只有一个元素10arr = [10];arr2 = new Array(10);console.log(arr2);</script>
<script>//创建一个数组//var arr = new Array();//使用字面量来创造数组//var arr = [];var arr = [1,2,3,4,5,10];//console.log(arr);var arr2 = new Array(10,20,30);//console.log(arr2);//创建一个数组,数组中只有一个元素10arr = [10];arr2 = new Array(10);console.log(arr2.length);</script>
3)数组中的元素可以是任意的数据类型
<script>//创建一个数组//var arr = new Array();//使用字面量来创造数组//var arr = [];var arr = [1,2,3,4,5,10];//console.log(arr);var arr2 = new Array(10,20,30);//console.log(arr2);//创建一个数组,数组中只有一个元素10arr = [10];arr2 = new Array(10);//console.log(arr2.length);arr = ["hello",1,true,null,undefined];console.log(arr);</script>
4)数组中也可以放对象和函数
5)数组中还可以放数组
<script>//创建一个数组//var arr = new Array();//使用字面量来创造数组//var arr = [];var arr = [1,2,3,4,5,10];//console.log(arr);var arr2 = new Array(10,20,30);//console.log(arr2);//创建一个数组,数组中只有一个元素10arr = [10];arr2 = new Array(10);//console.log(arr2.length);arr = ["hello",1,true,null,undefined];//console.log(arr);arr = [[1,2,3],[3,4,5],[5,6,7]];console.log(arr[1]);</script>