javascript入门5(0805)
1.函数的对象原型
<script>
// var fun = new Function();
var obj = new Object();
console.log(obj)
// caller返回调用的函数,包括注释
function fun(){
console.log('调用我的是'+fun.caller);
}
function demo(){
// 调用fun函数
fun()
}
demo();
// 若在顶层调用,则返回null
fun();//null
</script>
2.函数中this的指向问题
<script>
/*
在ECMAScript(ES5)中this的指代与其调用的位置有关
常见的this的指代：
***1、this作为普通函数调用时,this指代的是全局对象window(调用全局变量)
***2、this作为普通对象调用,this指代当前对象（实例化的对象）
3、this作为构造函数调用，this指代的是实例化对象
4、this作为apply切换时调用，this指代的是apply切换后的对象
*/
// 1、this作为普通函数调用时
// 全局变量
var name = '耿育淼';
function fun1(){
// 局部变量
var name = '刘璟';
console.log(name);//刘璟 全局变量和局部变量同时存在,优先使用局部变量
console.log(this.name);
}
fun1();
// 2 this作为普通对象调用,this指代当前对象
var name = '孙浩';
var obj = {
name:'小明',
age:22,
say:function(){
console.log(obj == this);//true
console.log(obj === this);//true
// console.log(obj.name+'是小红的男朋友');//小明
console.log(this.name+'是小红的男朋友');//小明
}
}
obj.say();
// 示例:
// 获取所有的this
var oLi = document.getElementsByTagName('li');
console.log(oLi);
// 循环绑定事件
for(var i=0;i<oLi.length;i++){
oLi[i].onclick = function(){
// console.log('111')
console.log(i);
console.log(this)
this.style.background = 'green';
}
}
// 3、this作为构造函数调用
// 自定义构造函数
function demo(){
this.name = '小李子';
this.age = 18;
this.say = function(){
console.log('正是李子成熟季');
}
}
var obj1 = new demo();
console.log(obj1);
console.log(obj1.name);//小李子
//
var obj2 = {
name:'向同学',
age:20,
love:function(){
console.log(this.name+'喜欢的是...');
}
}
// obj2.love();//向同学
obj2.love.apply(obj1);//小李子
obj2.love.apply();//孙浩 若apply()未传入参数,则代表全局变量
</script>
3.数组方法
<script>
/*
函数的三要素：
功能
参数
返回值
*/
// concat()数组连接 不改变原数组
var arr = [1,2,3,4,5];
var newArr = arr.concat('龚瑞');
console.log(newArr);//[1, 2, 3, 4, 5, "龚瑞"]
console.log(arr);//[1, 2, 3, 4, 5]
var arr = [1,2,3,4,5];
// 多个参数之间采用逗号连接
var newArr = arr.concat('龚瑞','成哥');
console.log(newArr);// [1, 2, 3, 4, 5, "龚瑞", "成哥"]
var arr = [1,2,3];
var arr1 = [4,5,6];
var newArr = arr.concat(arr1);
console.log(newArr);//[1, 2, 3, 4, 5, 6]
// join()将数组按照指定的字符拼接为字符串(默认按照逗号连接)
var arr = ['周','三','就','是','情','人','节'];
var newStr = arr.join();//周,三,就,是,情,人,节
var newStr = arr.join('');//周三就是情人节
console.log(newStr);
/*
出栈入栈 直接改变原数组
push()从数组的尾部压入一个元素
pop()从数组的尾部弹出一个元素，并接收返回的元素
unshift()从数组的头部压入一个元素
shift()从数组的头部弹出一个元素,并接收返回的元素
*/
// push()从数组的尾部压入一个元素
var arr = [1,2,3,4,5];
arr.push('向同学');
console.log(arr);// [1, 2, 3, 4, 5, "向同学"]
// 若压入的是数组,最终只占一个下标
var arr1 = ['黄满鑫','陈冬梅','耿育淼'];
arr.push(arr1);
console.log(arr);//[1, 2, 3, 4, 5, "向同学", Array(3)]
// pop()从数组的尾部弹出一个元素，并接收返回的元素
var res = arr.pop();
console.log(res);//返回弹出的元素 ["黄满鑫", "陈冬梅", "耿育淼"]
console.log(arr);
// unshift()从数组的头部压入一个元素
arr.unshift('a');
console.log(arr);
// shift()从数组的头部弹出一个元素
var res = arr.shift();
console.log(arr);
console.log(res);
</script>
4.数组的截取
<script>
/*
slice(start,end)数组的截取
一个参数:从指定下标开始截取,截取到最后
两个参数:从指定的下标开始截取,截取到指定下标之前
*/
// 一个参数:从指定下标开始截取,截取到最后
var arr = [1,2,3,4,5];
var newArr = arr.slice(2);
console.log(newArr);//[3, 4, 5]
// 两个参数:从指定的下标开始截取,截取到指定下标之前
var arr = [1,2,3,4,5];
var newArr = arr.slice(1,3);
console.log(newArr);//[2, 3]
var arr = [1,2,3,4,5];
// 负数代表倒数第几个
var newArr = arr.slice(-2);
console.log(newArr);// [4, 5]
var arr = [1,2,3,4,5];
// 负数代表倒数第几个
var newArr = arr.slice(1,-1);
console.log(newArr);//[2, 3, 4]
var arr = [1,2,3,4,5];
// 负数代表倒数第几个
var newArr = arr.slice(-3,-1);
console.log(newArr);//[3, 4]
// 数组只能从左往右截取
var arr = [1,2,3,4,5];
// 负数代表倒数第几个
var newArr = arr.slice(-1,1);
console.log(newArr);//[]
</script>
5.数组反转和排序
<script>
// reverse()数组的反转
var arr = [1,2,3,4,5];
arr.reverse();
console.log(arr);//[5, 4, 3, 2, 1]
// sort()数组按照ASCII码码值排序 底层为冒泡排序
var arr = [4,7,2,9,0,8];
arr.sort();
console.log(arr);//[0, 2, 4, 7, 8, 9]
var arr = [4,7,20,23,9,5,230,8];
arr.sort();
console.log(arr);//[20, 23, 230, 4, 5, 7, 8, 9]
/*
数字：48~57
大写字母：65~90
小写字母：97~122
*/
var arr = ['a','A',4,7,2,9,0,8];
arr.sort();
console.log(arr);//[0, 2, 4, 7, 8, 9, "A", "a"]
</script>
6.数学函数
<script>
/*
abs()绝对值 max()最大值 min()最小值 floor()向下取整 ceil()向上取整 round()四舍五入 pow()次方根 sqrt()开平方根 random()随机数
*/
console.log(Math);
// abs()绝对值
var num = 10;//10
var num = -10;//10
var res = Math.abs(num);
console.log(res)
// 最大值
var res = Math.max(5,8,2,9,0);
console.log(res);
// 最小值
var res = Math.min(5,8,2,9,0);
console.log(res);
// floor()向下取整
var num = 9.9;
var res = Math.floor(num);
console.log(res);//9 只保留整数位
// 向上取整
var num = 9.0001;
var res = Math.ceil(num);
console.log(res);//10 进一法取整
// round()四舍五入
var num = 9.0001;
var num = 9.6;//10
var res = Math.round(num);
console.log(res);//10 进一法取整
// pow(底数,指数)次方根
var res = Math.pow(2,10);
console.log(res);
// sqrt()开平方根
var res = Math.sqrt(16);//4
console.log(res);
// random()随机数 自动产生0~1的随机数,但是不包含1
console.log(Math.random());
// 生成0-9的随机数
var num = Math.floor(Math.random()*10);
console.log(num);
// 生成0~255的随机数
var num = Math.floor(Math.random()*256);
console.log(num);
// 拓展 四舍五入保留指定的小数位
var num = 36.6666;
var res = num.toFixed(2);
console.log(res);
</script>
