数据类型
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// 数据类型
// 简单数据类型，基本数据类型/值类型
// Number String Boolean Null Undefined
// 复杂数据类型，引用类型
// Ojbect
// 数据在内存中存储
// 简单数据类型 存储在内存中的栈上
// 复杂数据类型 存储在内存中的堆上
</script>
</head>
<body>
</body>
</html>简单类型在内存中的存储
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// 简单类型在内存中如何存储
var n1 = 10;
var n2 = n1;
</script>
</head>
<body>
</body>
</html>复杂类型在内存中的存储
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// 复杂类型在内存中如何存储
// Object 所有的对象都是基于Object
function Person(name, age) {
this.name = name;
this.age = age;
this.sayHi = function () {
console.log(this.name + ': hello');
}
}
var p1 = new Person('zs', 18);
var p2 = p1;
p1.name = 'ls';
console.log(p2.name);
</script>
</head>
<body>
</body>
</html>简单类型作为函数的参数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// 简单类型作为函数的参数，在内存中如何存储
function fn(a, b) {
// 函数的参数 其实就是函数内部的局部变量
a = a + 1;
b = b + 1;
console.log(a);
console.log(b);
}
var x = 10;
var y = 20;
fn(x, y);
console.log(x);
console.log(y);
</script>
</head>
<body>
</body>
</html>复杂类型作为函数的参数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// 复杂类型作为函数的参数，在内存中如何存储
function Person(name, age) {
this.name = name;
this.age = age;
this.sayHi = function () {
console.log(this.name + ': hello');
}
}
var p = new Person('zs', 18);
function fn(person) {
person.name = 'ls';
}
fn(p);
console.log(p.name);
</script>
</head>
<body>
</body>
</html>复杂类型作为函数的参数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// 复杂类型作为函数的参数，在内存中如何存储
function Person(name, age) {
this.name = name;
this.age = age;
this.sayHi = function () {
console.log(this.name + ': hello');
}
}
var p = new Person('zs', 18);
function fn(person) {
person.name = 'ls';
person = new Person('ww', 20);
console.log(person.name);
}
fn(p);
console.log(p.name);
</script>
</head>
<body>
</body>
</html>数组排序
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// 数组也是复杂类型
// 对数组排序，从小到大 -- 冒泡排序
function sort(array) {
// 外层循环 控制趟数
for (var i = 0; i < array.length - 1; i++) {
// 假设排好序了
var isSort = true;
// 内层循环 控制比较的次数
for (var j = 0; j < array.length - 1 - i; j++) {
if (array[j] > array[j + 1]) {
isSort = false;
// 交换位置
var tmp = array[j];
array[j] = array[j + 1];
array[j + 1] = tmp;
}
}
// 判断是否排好了
if (isSort) {
break;
}
}
// return array;
}
var array = [34, 12, 88, 20, 30];
var r = sort(array);
console.log(r);
console.log(array);
// var array = [34, 12, 88, 20, 30];
// function fn(arr) {
// arr[0] = -1;
// }
// fn(array);
// console.log(array);
</script>
</head>
<body>
</body>
</html>内置对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// JavaScript 组成： ECMAScript BOM DOM
// ECMAScript：变量 注释 数据类型 类型转换 操作符 流程控制语句（判断和循环） 数组 对象 构造函数 内置对象
// JavaScript中的对象有三种：自定义对象、内置对象、浏览器对象
// ECMAScript中的对象： 自定义对象、内置对象
//
// 内置对象：Math/Array/Date...
//
// 最常用的属性和方法
// 查文档：MDN
</script>
</head>
<body>
</body>
</html>MDN
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// console.log(Math.random());
// 生成 min 到 max 之间的随机数
var min = 10;
var max = 100;
console.log( parseInt(Math.random() * (max - min) + min));
</script>
</head>
<body>
</body>
</html>Math
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
body {
background-color: rgb(100, 100, 100);
}
</style>
<script>
// - 求10-20之间的随机数 [10, 20] 整数
// Math.random() -> [0, 1) 小数
// Math.random() * 20 -> [0, 20) 包含小数部分
// Math.random() * (20 - 10) -> [0, 10) 包含小数部分
// Math.random() * (20 - 10) + 10 -> [10, 20) 包含小数部分
// Math.floor(Math.random() * (max - min + 1) + min);
// Math.floor(Math.random() * (20 - 10 + 1) + 10);
// Math.floor(Math.random() * 11 + 10); -> Math.floor([0, 11) + 10) -> Math.floor([10, 21)) -> -> Math.floor([10, 20]) -> [10, 20] 整数
// function random(min, max) {
// return Math.floor(Math.random() * (max - min + 1) + min);
// }
// console.log(random(10, 20));
// - 随机生成颜色RGB [0, 255] 整数
// rgb(100, 100, 100)
// function random(min, max) {
// return Math.floor(Math.random() * (max - min + 1) + min);
// }
// function randomRGB(min, max) {
// var color1 = random(min, max);
// var color2 = random(min, max);
// var color3 = random(min, max);
// return 'rgb(' + color1 + ', ' + color2 + ', ' + color3 + ')';
// }
// console.log(randomRGB(0, 255))
// - 模拟实现max()/min()
// console.log( Math.min(23, 1, 4, 2 ,10));
// Math.max()
// function max() {
// // arguments
// var max = arguments[0];
// for (var i = 1; i < arguments.length; i++) {
// if (max < arguments[i]) {
// max = arguments[i];
// }
// }
// return max;
// }
// function min() {
// // arguments
// var min = arguments[0];
// for (var i = 1; i < arguments.length; i++) {
// if (min > arguments[i]) {
// min = arguments[i];
// }
// }
// return min;
// }
// console.log(min(5, 1, 100, 23));
//
var MyMath = {
max: function () {
var max = arguments[0];
for (var i = 1; i < arguments.length; i++) {
if (max < arguments[i]) {
max = arguments[i];
}
}
return max;
},
min: function () {
var min = arguments[0];
for (var i = 1; i < arguments.length; i++) {
if (min > arguments[i]) {
min = arguments[i];
}
}
return min;
}
};
console.log(MyMath.max(10, 1, 100, 20));
</script>
</head>
<body>
</body>
</html>静态成员和实例成员
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
var MyMath = {
PI: 3.1415926,
max: function () {
},
min: function () {
}
}
// 工具中使用静态成员
// 静态成员 ： 直接使用对象来调用的
// MyMath.PI;
// MyMath.max()
//
//
//
// 当有很多个对象的时候 使用构造函数的形式来创建对象
// 实例成员 : 构造函数中的成员就是实例成员
// 什么是实例：对象的另一种说法
function Person(name, age) {
this.name = name;
this.age = age;
this.sayHi = function () {
}
}
// 通过构造函数创建对象
var p = new Person('zs', 18);
p.sayHi
</script>
</head>
<body>
</body>
</html>
Date
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// Math对象和Date对象的区别
//
// Math 不是一个构造函数，里面提供是静态成员
// var MyMath = {
// PI: 3.14,
// max: function () {
// }
// }
// 静态成员
// MyMath.PI
// MyMath.max();
// Date 是一个构造函数，首先要通过new Date() 来创建日期实例(对象)，实例成员
// var d = new Date();
// console.log(d);
// GMT 格林威治时间 世界标准时间
// GMT+0800 (中国标准时间)
//
// 距离1970-1-1相差的毫秒数
// console.log(d.valueOf());
// 日期构造函数 Date()
// 1 空构造函数 获取的是当前时间对象
// var d = new Date();
// console.log(d);
// console.log(d.valueOf());
// 2 构造函数中传入 毫秒值
// var d = new Date(1502088177998);
// console.log(d);
//
// 3 可以传入日期形式的字符串
// var d = new Date('1988-8-8 8:8:8');
// console.log(d);
// console.log(d.valueOf());
//
// 4 可以传入数字
// var d = new Date(1928, 8, 8);
// console.log(d);
// console.log(d.valueOf());
// 如何获取日期对象的毫秒值
// var d = new Date();
// // 获取日期对象的毫秒值 不用我们调用
// // console.log(d.valueOf());
// // 和valueOf的作用是一样的
// console.log(d.getTime());
// 获取当前时间的毫秒值 静态成员
// var num = Date.now(); // 浏览器兼容问题 HTML5
// console.log(num);
// + 在这里是取正
// var num = Number( new Date());
var num = + new Date();
console.log(num);
</script>
</head>
<body>
</body>
</html>Date的方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// 2017-10-10 10:10:10
// var d = new Date();
// // 打印日期对象的时候。内部调用了toString()
// // console.log(d);
// // console.log(d.toString());
// // console.log(d.toDateString());
// // console.log(d.toTimeString());
// console.log(d.toLocaleDateString());
// console.log(d.toLocaleTimeString());
// 获取日期中的指定部分
var d = new Date();
console.log(d.getFullYear());
// !--------注意：月份是从0开始的-------------
console.log(d.getMonth() + 1);
console.log(d.getDate());
console.log(d.getHours());
console.log(d.getMinutes());
console.log(d.getSeconds());
</script>
</head>
<body>
</body>
</html>