一、JavaScript中的对象是个什么东西
1、 对象是什么?什么是对象?
1)对象是多个数据(属性)的封装体(集合)
2)可以用来保存多个数据(集合)的容器
3)一个对象代表现实中的一个事物
2、为什么要用对象?
为了能够方便统一管理多个数据
3、对象是由什么组成的?
属性: 属性名(字符串)和属性值(任意)组成
方法: 一种特别的属性(属性值是函数)
4、怎样去访问对象的内部数据?
1).属性名: 编码简单, 有时不能用
2)['属性名']: 编码麻烦, 能通用
<script type="text/javascript">
var p = {
name: 'zhangsan',
age: 18,
setName: function (name) {
this.name = name
},
setAge: function (age) {
this.age = age
}
}
p.setName('lisi')
p['setAge'](23)
console.log(p.name, p['age'])
</script>
5、什么时候必须使用['属性名']的方式?
当属性名出现特定的字符串如-或空格,又或者当属性名不确定的时候要用到['属性名']的方式
<script type="text/javascript">
var p = {}
//1. 给p对象添加一个属性: ni hao: text
// p.ni hao = 'text' //不能用
p['ni hao'] = 'text'
console.log(p['ni hao'])
//2. 属性名不确定
var propName = 'myAge'
var value = 18
// p.propName = value //不能用
p[propName] = value
console.log(p[propName])
</script>
二、函数又是个什么玩意
1、函数是什么?什么是函数?
函数是可以执行的,是为了执行nnn条代码(语句)而进行封装后的封装体
2、为什么要用函数?
首先是可以提高代码的复用,其次就是更加便于阅读交流
3、怎样去定义一个函数?
函数声明 或 表达式
4、怎样去调用(执行)一个函数?
1)test(): 直接调用
2)obj.test(): 通过对象调用
3)new test(): new调用
4)test.call/apply(obj): 临时让test成为obj的方法进行调用
<script type="text/javascript">
/*
判断大小
小于10, 真小
大于100,真大
大于30小于60,就你了
*/
function show (num) {
if(num<10) {
console.log('真小')
} else if(num>100) {
console.log('真大!')
} else if(num>30 && num<60) {
console.log('就你了')
}
}
function fn1 () { //函数声明
console.log('fn1()')
}
var fn2 = function () { //表达式
console.log('fn2()')
}
var obj = {}
function test2 () {
this.xxx = 'atguigu'
}
// obj.test2() 没有所以就不能.
test2.call(obj) // obj.test2() // 可以让一个函数成为指定任意对象的方法进行调用
console.log(obj.xxx)
</script>
三、回调函数又又是个什么鬼?
1、回调函数是什么?什么是回调函数?
是你自己定义的但是又没有调用它,但但是最后的最后它还是执行了
2、常见的回调函数?----4种
1)dom事件回调函数 ==>发生事件的那个dom元素
2)定时器回调函数 ===>window
3)ajax请求回调函数
4)生命周期回调函数
<button id="btn">点我一下</button>
<script type="text/javascript">
document.getElementById('btn').onclick = function () { // dom事件回调函数
alert(this.innerHTML)
}
//定时器
setTimeout(function () { // 定时器回调函数
alert('时辰到了'+this)
}, 1000)
</script>
四、函数中的this又又又怎么理解?
1、什么是this?this是什么?
所有的函数都是需要通过某个对象来调用,但是如果没有指定对象,那就是window;
所有的函数内部都有一个this变量,谁调用就指向谁那就是谁。
2、如何确定this的值?----四种方式
test();
p.test();
new test();==>(即新创建的对象)
p.call(obj);
<script type="text/javascript">
function Person(color) {
console.log(this)
this.color = color;
this.getColor = function() {
console.log(this)
return this.color;
};
this.setColor = function(color) {
console.log(this)
this.color = color;
};
}
Person("red"); //this==>window
var p = new Person("yello"); //this==>p
p.getColor(); //this==>p
var obj = {};
p.setColor.call(obj, "black"); //this==>obj
var test = p.setColor;
test(); //this==>window
function fun1() {
function fun2() {
console.log(this);
}
fun2(); //this==>window
}
fun1();
</script>
最后
写下这篇文章是为了记录学习过程中的要点,并希望借此能够起到巩固复习作用;相信不止我一人是跟着网上某些资料进行学习的,所以代码如有雷同,那也正常;代码写着或者贴出来后会比较乱,我自己看也许会感觉比较清晰,但是读者看着就会稍有迷糊,建议结合自身的学习资料和笔记对照着来看。