1、作用域
2、预解析
3、创建对象的三种方式
4、访问对象属性和方法的方式
5、json格式的数据及遍历
6、简单类型和复杂类型，参数传递
7、内置对象
8、js的Math对象
9、js的String对象
10、js的Araay对象
11、js的Date对象
1、作用域 <--返回目录
块级作用域：一个大括号可以看成是一块，在这块区域中定义的变量，只能在这个区域中使用。
全局变量：用var声明的变量，可以在任何地方使用
局部变量：在函数内部定义的变量
隐式全局变量：声明的变量没有var。全局变量是不能被删除的，隐式全局变量可以被删除。
{ var a = 10; console.log(`a=${a}`); // 10 } console.log(`a=${a}`); // 10 { const b = 10; console.log(`b=${b}`); } //console.log(`b=${b}`); // b is not defined { let c = 10; console.log(`c=${c}`); } //console.log(`c=${c}`); // c is not defined
if块
if (false) { var b = 20; } console.log(`b=${b}`) // b=undefined if (true) { var c = 20; } console.log(`c=${c}`) // c=20
方法内定义的变量
function fun () { var a = 10; console.log(`fun方法内打印a的值，a=${a}`) } fun() //console.log(`fun方法外打印a的值，a=${a}`) // a is not defined
隐式全局变量
/* 全局变量是不能被删除的，隐式全局变量可以被删除 */ var a = 10 delete a console.log(`a=${a}`) // a=10 b = 20 console.log(`b=${b}`) // b=20 delete b console.log(`b=${b}`) // b is not defined
/* 函数调用后，函数内没有加var声明的变量被提升为隐式全局变量 */ function fun () { a = 10 var b = 20 } // console.log(`a=${a}`) // a is not defined // console.log(`b=${b}`) // b is not defined fun() console.log(`a=${a}`) // a=10 console.log(`b=${b}`) // b is not defined
2、预解析 <--返回目录
/* 把变量的声明提前到当前作用域最前面 */ console.log(a) // undefined var a = 10 // 上面代码相对于 var a console.log(a) a = 10
/* 把函数的声明提前到当前作用域最前面 */ fun() function fun() { console.log('调用fun()') }
3、创建对象的三种方式 <--返回目录
第一种：调用系统的构造函数创建对象
var obj = new Object(); obj.name = "小明";//添加属性 obj.age = 20; obj.sex = "男"; obj.eat = function() { //添加方法 console.log("吃饭"); }; console.log(obj.name);//获取对象的属性 obj.eat();//调用对象的方法
如何一次性创建多个对象？把创建对象的代码封装在一个函数中，即工厂模式创建对象(结合第一种和需求通过工厂模式创建对象)
function createObject(name, age) { var obj = new Object(); obj.name = name; obj.age = age; obj.sayHi = function() { console.log("hello，我叫" + obj.name); } return obj; } //创建一个对象 var per1 = createObjcet("张三",10); per1.sayHi();
第二种：自定义构造函数创建对象
自定义构造函数创建对象(创建出来的对象可以知道其类型)
函数与构造函数的区别：名字首字母是否大写
function Person(name, age){ this.name = name; this.age = age; this.sayHi = function(){}; } var obj = new Person("lisi", 20); console.log(obj.name); console.log(obj instanceof Person); // true console.log(obj instanceof Object); // true
当代码var obj=new Person("lisi",20);执行时，做了4件事
** 在内存中开辟空间 ，存储创建的对象
** 把this设置为当前的对象
** 设置对象的属性和方法
** 把this这个对象返回
第三种：字面量的方式创建对象
var obj = {}; // 定义一个对象 obj.name = "zs"; obj.sayHi = function() {}; // 优化后的写法： var obj2 = { name: "lisi", age: 20, sayHi: function(){ alert("hi，我叫" + this.name); } }; obj2.name = "zhangsan"; obj2.sayHi(); // 调用对象的方法
4、访问对象属性和方法的方式 <--返回目录
function Person(name, age) { this.name = name; this.age = age; this.play = function() {}; } var obj = new Person("zs", 20); console.log(obj.name); // 访问对象的属性 console.log(obj["name"]); // 访问对象的属性 obj.play(); // 调用对象的方法 obj["play"](); // 调用对象的方法
5、json格式的数据及遍历 <--返回目录
json格式的数据：成对的键值对
var json = { "name": "xiaoming", "age": "10" }; alert(json.name); alert(json["name"]);
通过for-in循环遍历
for(var key in json){ console.log(json[key]); }
6、简单类型和复杂类型，参数传递 <--返回目录
js原始数据类型：number, string, boolean, undefined, null, object
基本类型(简单类型), 值类型: number, string, boolean
复杂类型, 引用类型: object
空类型: undefined, null
值类型在内存中存储位置：栈
引用类型在内存中存储位置：对象在堆中存储，地址在栈中存储
值类型和引用类型的参数传递：值类型传值，引用类型传地址（对象的引用）
7、内置对象 <--返回目录
js学习的三种对象
- 内置对象： Math、Date、String、Array、Object等
- 自定义对象
- 浏览器对象--BOM
如何验证变量是不是对象？
console.log(Array instanceof Object);//内置对象，true var obj={};//自定义对象 console.log(obj instanceof Object); // true
8、js的Math对象 <--返回目录
* 数学的运算。Math里面都是静态方法，直接通过Math.方法使用
* 方法
- ceil(): 向上取整
- floor()：向下取整
- round(): 四舍五入
- random(): 得到随机数[0-1) Math.floor(Math.random*10)得到0-9随机整数
- pow(m,n): m的n次方
* 属性 PI
9、js的String对象 <--返回目录
* 创建String对象 var str="abc";
* 属性length：字符串的长度 document.write(str.length);
* 方法
（1）与html相关的方法
- bold()：加粗
- fontcolor("red")：设置字体颜色
- fontsize("1-7")：设置字体大小
- sub()，sup():下标，上标
- link("a.html"):将字符串显示成超链接
（2）与java相似的方法
- str1.concat(str2):连接字符串
- str.charAt(1)：返回指定位置的字符，如果索引超出，返回空字符
- str.indexOf("a"):返回字符的索引位置，不存在，返回-1。
** str.indexOf("") 返回0
- split():切割字符串，成字符数组
** var str = "a-b-c";
var arr1=str.split("-");//['a','b','c']
document.write(arr1.length);
- replace(旧字符串oldStr或正则表达式regexp，新字符串newStr):替换字符串,并返回替换后的字符串
** 如果 regexp 具有全局标志 g，那么 replace() 方法将替换所有匹配的子串。否则，它只替换第一个匹配子串。
** var str="helloworldhello";
console.log(str.replace("hello","您好"));//您好worldhello,只替换第一个匹配的
console.log(str.replace(/hello/g,"您好"));//您好world您好，替换所有匹配的
- substr(start,[length])：从起始索引号提取字符串中指定数目的字符。
** 参数length：可选。子串中的字符数。必须是数值。如果省略了该参数，如果没有指定 lenght，
那么返回的字符串包含从 start 到 stringObject 的结尾的字符。
- substring(索引start,[索引end])：包左不包右，提取字符串中两个指定的索引号之间的字符。
** 如果省略第二个参数end，那么返回的子串会一直到字符串的结尾
10、js的Araay对象 <--返回目录
* 创建Array对象
- var arr = new Array(1,2,3);
* 属性length：数组长度
* 方法
- arr1.concat(arr2):数组的连接
- join():根据指定字符分割数组，组成字符串
** var arr1 = [a,b,c];
arr.join("-");
docment.write(arr);//a-b-c
- push():向数组末尾添加元素或数组，返回新数组的长度（把数组整体当成一个元素）
- pop():删除最后一个元素，并返回此元素 arr.pop()
- reverse():将数组顺序颠倒
11、js的Date对象 <--返回目录
* 获取当前时间 var date =new Date();
- 将date转换为本地格式 date.toLocaleString()
** var date = new Date();
console.log(date);//Thu Jun 28 2018 11:18:40 GMT+0800 (中国标准时间)
console.log(date.toLocaleString());//2018/6/28 上午11:19:28
- 获取当前年 date.getFullYear()
- 获取当前月(返回0-11) 【date.getMonth()+1】
- 获取当前星期(返回0-6) date.getDay() 星期日----0
- 获取当前天（返回1-31） date.getDate()
- 获取当前小时(返回0-23) date.getHours()
- 获取当前分钟(返回0-59) date.getMinutes()
- 获取当前秒(返回0-59) date.getSeconds()
- getTime():获取从1970年一月一日至今的毫秒数
* 应用场景：使用毫秒数处理缓存的效果（没有缓存）http://www.baidu.com?毫秒数
* 数组的月份6，改成06
var date = new Date(); console.log(date);//Thu Jun 28 2018 11:18:40 GMT+0800 (中国标准时间) console.log(date.toLocaleString());//2018/6/28 上午11:19:28 var m = (date.getMonth()+1) + "";//date.getMonth()返回number类型 if(m.length==1){ m = '0' + m; } alert(m);//06