目录
内部样式
<head>
<script>
alert("Hello,World!");
</script>
<meta charset="utf-8">
<title>样式表举例</title>
<!--
对h1设置内部样式,具体要求参考效果图。
-->
<style>
h1{
color: purple;S
font-family: 隶书;
font-weight:bold;
font-size: 36px;
}
</style>
</head>
外部引用(src)
<script src="main.js"></script>
页面写一句话(document)
document.write("Hello,World!");
控制台输出(console)
<script>
console.log("输出一条日志");//最常用
console.info("输出一条信息");
console.warn("输出一条警告");
console.error("输出一条错误");
</script>
弹窗显示(alert)
alert("Hello,World!");
注释(// /* 注释 */
)
基础语法
关键字
字面量和变量(var)
数据类型
- 字符串型(String)
- 数值型(Number)
- 布尔型(Boolean)
- undefined型(Undefined)
- null型(Null)
typeof运算符(检查数据类型)
console.log(typeof 123);
console.log(typeof "Hello,World!");
console.log(typeof true);
console.log(typeof undefined);
console.log(typeof null);
运行结果
转义字符
强制类型转换
//String类型
var a = 123;
a = a.toString(); //第一种
console.log(a);
console.log(typeof a);
a = a + ""; //第2种
c = String(c); //第3种
//int类型
a = parseInt(a);
a = parseFloat(a);
a = Number(c);
//Boolean类型
使用Boolean()函数
数字 —> 布尔
除了0和NaN,其余的都是true
字符串 —> 布尔
除了空串,其余的都是true
null和undefined都会转换为false
对象也会转换为true
运算符
算术运算符
关系运算符
幅值运算符
逻辑运算符
代码块
{
var a = 123;
a++;
alert(a);
}
if else 和 switch case..
var age = 18;
if (age < 18) {
console.log("小于18岁了");
} else if (age == 18) {
console.log("已经18岁了");
} else {
console.log("大于18岁了")
}
var month = 10;
switch (month) {
case 1:
case 3:
case 5:
case 7:
case 8:
case 10:
case 12:
console.log("31天");
break;
case 4:
case 6:
case 9:
case 11:
console.log("30天");
break;
case 2:
console.log("28天");
break;
default:
console.log("输入错误");
}
跳出循环
outer: for (var i = 0; i < 10; i++) {
for (var j = 0; j < 10; j++) {
if (j == 5) {
break outer;
}
console.log(j);
}
}
-
对象基础
创建对象
var person = new Object();
person.name = "孙悟空";
person.age = 18;
console.log(person);
var person = {
name: "孙悟空",
age: 18
};
console.log(person);
删除属性
var person = new Object();
person.name = "孙悟空";
person.age = 18;
console.log(person);
delete person.name
console.log(person);
遍历对象(for (var..in..))
var person = {
name: "zhangsan",
age: 18
}
for (var personKey in person) {
var personVal = person[personKey];
console.log(personKey + ":" + personVal);
}
函数(funtion)
函数创建
var fun = new Function("console.log('这是我的第一个函数');");
function fun(){
console.log("这是我的第二个函数");
}
var fun = function() {
console.log("这是我的第三个函数");
}
function sum(num1, num2) {
return num1 + num2;
}
var result = sum(10, 20);
console.log(result);
函数调用
// 函数声明
var fun = function () {
console.log("哈哈,我执行啦!");
}
// 函数调用
fun();
// 函数声明
var sum = function (num1, num2) {
var result = num1 + num2;
console.log("num1 + num2 = " + result);
}
// 函数调用
sum(10, 20);
对象中的函数
var person = {
name: "zhangsan",
age: 18,
sayHello: function () {
console.log(name + " hello")
}
}
person.sayHello();
对象批量创建
// 使用工厂模式创建对象
function createPerson(name, age) {
// 创建新的对象
var obj = new Object();
// 设置对象属性
obj.name = name;
obj.age = age;
// 设置对象方法
obj.sayName = function () {
console.log(this.name);
};
//返回新的对象
return obj;
}
for (var i = 1; i <= 1000; i++) {
var person = createPerson("person" + i, 18);
console.log(person);
}
用构造函数创建对象
// 使用构造函数来创建对象
function Person(name, age) {
// 设置对象的属性
this.name = name;
this.age = age;
// 设置对象的方法
this.sayName = function () {
console.log(this.name);
};
}
var person1 = new Person("孙悟空", 18);
var person2 = new Person("猪八戒", 19);
var person3 = new Person("沙和尚", 20);
console.log(person1);
console.log(person2);
console.log(person3);
instanceof
console.log(person1 instanceof Person);