提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档
1.函数的call和apply
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
/*
* call()和apply()
* - 这两方法都是函数对象的方法,需要通过函数对象来调用
* - 当对函数调用call()和apply()都会调用函数执行
* - 不同的的是:
* - 在调用call()和apply()可以将一个对象指定为第一个参数
* 此时这个对象将会成为函数执行时的this
* - call()方法可以将实参在对象之后依次传递
* - apply()方法需要将实参封装到一个数组中统一传递
*
* - this的情况:
* 1.以函数形式调用时,this永远都是window;fun()====window.fun()
* 2.以方法的形式调用时,this是调用方法的对象;
* 3.以构造函数的形式调用时,this是新创建的那个对象
* 4.使用call和apply调用时,this是指定的第一个参数的那个对象
*
*
*
*/
/*
* 三者相同:
fun.apply();
* fun.call();
* fun();
*/
/*function fun(){
alert(this);
}*/
/*var obj = {};
var obj2 ={};*/
/*指定(传)谁就是谁*/ //这里指的是:参数传的对象是谁,this的指向就是谁
//fun.call(obj);
//1.fun.apply(obj); var obj = {};
//fun.apply(obj2);//这里的this1就是obj2
/*this就只能指定的是window*/
//fun();
/*二,方法使用的时候:*/
function fun(a,b){
//alert(this);
console.log("a = "+a);
console.log("b ="+ b);
}
var obj = {
this.name="obj1";
this.sayName = function(){
alert(this.name);
}
};
var obj2 ={
this.name="obj2";
};
/*call的时候*/
obj.sayName.call(obj,2,3);//后面可以传递实参
/*apply的时候*/
//指定执行的对象方法,参数是谁,this就是谁
// obj.sayName.apply(obj2);
//obj.sayName.apply(obj,2,3);//参数错误
//怎么解决:需要将实参封装到一个数组中统一传递
obj.sayName.apply(obj,[2,3]);//使用[]封装到数组
</script>
</head>
<body>
</body>
</html>
2.arguement实参列表和参数
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
2.封装实参的对象arguments
* - arguments是一个类数组对象,它可以通过索引来操作数据,也可以获取长度
* - 在调用函数时,我们所传递的实参都会在arguments中保存
* - arguments.lenght可以用来获取实参的长度
* - 我们即使不定义形参,可以通过argumengt来使用实参
* 只不过比较麻烦
* arguments[0]表示第一个实参
* arguments[1]表示第二个实参
* - 它这里面有一个属性叫做callee
* 这属性对应一个函数对象,就是当前正在指向的函数对象
*
*/
/*无形参的时候:*/
/*function fun(a,b)有形参的时候arguments也一样*/
function fun(){
//console.log(arguments instanceof Array);
//console.log(Array.isArray(argument));
//console.log(arguments.length);
//console.log(arguments[1]);//arguments[2]
//console.log(arguments.callee);
console.log(arguments.callee == fun);//显示true
}
fun("hello",true);
</script>
</head>
<body>
</body>
</html>
3.Date对象
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
Date对象
* - 在JS中使用Date对象来表示一个时间
*
*/
//创建一个Date对象
//如果直接使用构造函数创建一个Date对象,则会封装为当前代码执行的时间
//var d = new Date();
//console.log(d);//显示当前的北京时间
/*自定义时间*/
/*创建一个指定的时间对象*/
/*需要在构造函数中传递一个表示时间的字符串作为参数*/
/*字符串日期格式:月份/日/年 时:分:秒*/
var d2 = new Date("12/19/1997 18:30:30");
//console.log(d2);
/*Date的方法*/
/*
* getDate();
* 获取当前日期对象是几日*/
//var date = d.getDate(); 25号
//var date = d2.getDate();//19号
/*
* getDay();
* 输出今天是周几
* 0表示周日
*/
/*var dateday = d2.getDay();
console.log(dateday);//5*/
/*
* getMonth();
* 输出今天是第几月
* 会返回0-11的数字
* 0表示1月
* 1表示2月
*/
/*var month = d2.getMonth();
console.log(month);*/
/*
* getFullYear();
* 输出的是年份
* */
/*var year = d2.getFullYear();
console.log(year);*/
/*
* getTime();
* - 获取当前日期对象的时间戳
* - 时间戳:指的是从格林威治标准时间的1970年1月1日,0时0分0秒
* 到当前日期所花费的毫秒数(可以转换为小时)
* (1s = 1000毫秒)
*
* 注意:var timejiange = d2.getTime("1/1/1970 0:0:0");这个是北京时间
* 和格林时间相差8个小时
* 所以输出-28000000
*
*
* */
/*var timejiange = d2.getTime();
//console.log(timejiange/1000/60/60/24/365);
console.log(timejiange);*/
/*获取当前的时间戳*/
//表示这79行代码执行的当前时间
/*time = Date.now();
console.log(time);*/
/*用途:测试程序性能:
开始头部放一个时间戳
结束尾部放一个时间戳
相减:得出时间
*/
/*var start = Date.now();
for(var i=0 ; i<100 ; i++)
{
console.log(i);
}
var end = Date.now();
console.log("执行了:"+(end - start)+"毫秒");*/
</script>
</head>
<body>
</body>
</html>
4.Math
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
Math
- Math和其他元素的对象不同,它不是一个构造函数
它属于一个工具类不用创建对象,它里面封装了数学运算相关的属性和方法
* - 比如
* Math.PI 表示的圆周率 3.141593653589397
* abs绝对值
* Math.ceil(1.2);为2
* - 可以对一个整进行向上取整,小数位只要有值就自动进1
* Math.floor(1.6);为1
* - 可以对一个数进行向下取整,小数部分要被舍掉
* Math.round(1.4);为1
* - 可以对一个数进行四舍五入取整
*
*/
//使用: Math.方法;
/*
Math.random();
* - 可以生成0-1之间的随机数:console.log(Math.random());
* 我如果要生成0-10之间的随机数
* - 生成一个0-10的随机数
* - 生成一个0-x之间的随机数
* Math.round(Math.random()*x);
*
* 那如果我想生成:1-10
* 生成一个x-y之间的随机数
* 规律:console.log(Math.round(Math.random()*9)+1);
* Math.round(Math.random()*(y-x))+x
*/
/*for(var i = 0 ; i<10 ; i++){
//console.log(Math.random()*10);//达到0-10的数,但是不会有0和10
//那该怎么办呢!来一个四舍五入的方法:Math.round();
console.log(Math.round(Math.random()*10));
//document.write(Math.round(Math.random()*10));
}*/
//那如果我想生成:1-10 来解决它
/*for(var i = 0 ; i<10 ; i++){
//console.log(Math.round(Math.random()*9)+1);//1-10
console.log(Math.round(Math.random()*8)+2);//2-10
//可以向上取整:不行
//document.write(Math.ceil(Math.random()*9)+1));报错
}*/
/*最大最小值:max和min*/
/*
* max() 可以获取多个数中的最大值
* min() 可以获取多个数中的最小值
*/
/*var max = Math.max(10,45,30,100);
var min = Math.min(10,45,30,100);
console.log("max="+max);
console.log("min="+min);*/
/*
Math.pow(x,y);
* 返回x的y次幂
* Math.sqrt(x);
* 对x进行开方运算
*
*/
/*var sum = Math.pow(10,2);
console.log(sum);//100s*/
/*var sum = Math.sqrt(100);
console.log(sum);//10
*/
</script>
</head>
<body>
</body>
</html>
5.包装类
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*
基本数据类型
* String Number Boolean Null Undefined
*
* 引用数据类型
* Object
*
* 在JS中为我们提供了三个包装类,通过这三个包装类可以将基本的数据类型转换为对象
* (其实这三种都是构造函数)
* String()
* - 可以将基本数据类型字符串转换为String对象
*
*
* Number()
* - 可以将基本数据类型字符串转换为Number对象
*
*
* Boolean()
* - 可以将基本数据类型字符串转换为Boolean对象
*
* 但是注意:对象比较的时候,因为对象比较的时候,里面的值比较的是地址
* 地址不会一样,所以就会造成两个一样的数组,出现false的情况
*
* 注意:我们在实际应用中不会使用基本数据类型的对象
* 如果使用基本数据类型对象,在做一些比较时可能会带来一些不可以预期的结果
*
*/
//创建了一个Number类型的对象
var num = new Number(3);
/*console.log(typeof num);//object*/
//创建了一个String类型的对象
var str = new String("hello");
/*console.log(typeof str);显示:object
*/
//创建了一个Boolean类型的对象
var bool = new Boolean(true);
/*console.log(typeof bool);显示:object
*/
/*问题:基本数据类型的功能强大还是对象的功能强大?*/
//向num对象中添加一个属性
num.name = "abcdefg";
console.log(num.hello);//输出abcdefg
//向数据类型中添加一个属性
var a = 3 ;
a.hello = "你好";
console.log(a.hello);//输出:undefined
/*所以说:基本对象比基本数据类型更加强大*/
/*比较:比较两个对象的数的时候,就会出现false*/
var num2 = new Number(3);
console.log(num1 == num2);//显示false
/*
比较的时候,不适合用对象
*
*/
var b = new Boolean(false);//在这里还是会执行该结果
if(b){
alert("我我运行了~~~");
}
/*
原因就是因为:Boolean转成一个对象都是返回true,所以返回的b = true
* */
/*
方法和属性只能添加给对象,不能添加给基本的数据类型
* 当我们对一些基本数据类型的值去调用属性和方法的时候
* 浏览器会先临时使用包装类将基本数据类型转换为对象,然后在调用对象的属性方法
* 调用完以后,在将其转换为基本的数据类型
*
*
*
*/
/*举例:
基本数据类型不能使用属性和方法,都是使用第三方对象来保存使用
调用完之后再将其转换为基本数据类型
* */
var s = 123;
//在这里先使用Number包装类,然后先使用对象来调用toString()方法,调用完以后,在将其转换为基本的数据类型
s = s.toString();
/*console.log(s);
console.log(typeof s);*/
s.hello ="hello";//第一个调用的对象,调用结束就销毁了
console.log(s.hello);//第二次调用对象,调用结束就销毁了
//他们两个对象不是同一个,而是不同对象的两次调用
</script>
</head>
<body>
</body>
</html>
6.String字符串
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
/*创建一个字符串*/
//var str = "Hello Atguigu"
/*
在底层字符串是以字符数组的形式保存的
* ["H","e","1",.......]
*
*
*/
//console.log(str.length); 显示13
//console.log(str[5]);//用数组的方式取字符串
/*
charAt()
- 可以返回字符串中指定位置的字符
* - 根据索引取字符
*
*/
/* var str = "Hello Atguigu"
var result = str.charAt(0);//str[0]=H
console.log(result);*/
/*
charCodeAt()
- 或取该数的Unicode的编码
*
*
*/
/* var str = "Hello Atguigu"
var result = str.charCodeAt(0); 显示0的编码
console.log(result);*/
/*
concat();连接字符串
* - 可以用来连接两个或者多个字符串
* - 作用和+一样
*/
/*var result = String.fromCharCode(72);
result = str.concat("你好","再见");
console.log(result);
//显示:H你好再见*/
/*
indexof("检索对象",从当前位置开始找)
* - 该方法可以检索该字符串中内容的索引
* - 如果字符串含有该内容,则会返回其第一次出现的索引
* 如果没有找到指定的内容,在indexof会显示 -1
* - 可以指定一个第二个参数,指定开始查找的位置
*
* lastIndexOf();
* - 该方法的用法和indexof()一样
* 不同的是indexof从前往后找
* 而lastIndexOf是从后往前找
* - 可以指定一个第二个参数,指定开始查找的位置
*/
/*var str = "Hello Atguigu"
//var result = str.indexOf("l");//显示2
var result = str.indexOf("l",3);//显示3
console.log(result);*/
/*
slice()
- 可以从字符串中截取指定的内容
* - 不会影响原字符串,而是将截取到的内容返回
* - 参数:
* 第一个,开始位置的索引(包括开始位置)
* 第二个,结束位置的索引(不包括结束的位置)
* - 第二个可以省略,则会截取到后面所有的
* - 也可以传递一个负数作为参数,负数的话将会从后计算
*
*
*/
/*str = "abcdefghujk";
result = str.slice(1,4);//显示:bcd
result = str.slice(1,-1);//显示 : bcdefghuj
console.log(result);
*/
/*
substring()
* - 可以用来截取一个字符串,可以slice()类似
* - 参数:
* 第一个,开始位置的索引(包括开始位置)
* 第二个,结束位置的索引(不包括结束的位置)
* - 不同的是这个方法不接受负值作为参数
* 如果传来了一个负值,则默认使用0
* - 而且他还自动调整参数的位置,如果第二个参数小于第一个,则自动交换
*/
//result = str.substring(1,4);//显示:bcd
/*这俩相等:
result = str.substring(1,0);//a
result = str.substring(0,1);//a*/
/*
substr()
* - 用来截取字符串
* - 参数:
* 1.截取开始位置的索引
* 2.截取的长度
* result = str.substr(3,2).;
*/
/*
split()
* - 可以将一个字符串拆分为一个数组
* - 参数:
* - 需要一个字符串作为参数,将会根据该字符串去拆分数组
*
*
* - 如果传递一个空串:那就是把每一个字符的分开
*
*
*/
/*str = "abc,bcd,efg,hij";
result = str.split(",");//根据逗号拆分数组
console.log(result);
console.log(result[1]);//bcd
//判断是不是数组
console.log(Array.isArray(resul));//true
* */
/*字符串转换为大小写*/
/*
toUpperCase()
* - 将一个字符串转换为大写并返回
*
* toLowerCase()
* - 将一个字符串转换为小写并返回
*/
str ="abcdefg";
result = str.toUpperCase();
str = "ABCDEFG";
str.toLowerCase();
/*特别一些的*/
/*
fromCharCode();
- Unicode的编码或者转换成字符
* String.fromCharCode();
* 使用字符串String调用的
*/
/* var str = "Hello Atguigu"
var result = String.fromCharCode(72);//显示H
console.log(result);
*/
</script>
</head>
<body>
</body>
</html>