什么是JavaScript?
JavaScript是一种客户端脚本语言(轻量级编程语言)
JavaScript通常被直接嵌入HTML页面,有浏览器解释执行
JavaScript是一种解释性语言(代码不进行预编译)
弱类型和基于对象。
JavaScript的三个核心:ECMAScript基本语法、DOM、BOM
前端Web技术的组成:HTML、CSS、JavaScropt
- HTML是一种标记语言,又来结构化网页内容并赋予定义,例如定义段落、标题或嵌入图片、视频。
- CSS是一种样式规则语言,将样式应用于HTML内容,例如颜色、背景、字体、布局等。
- JavaScript 是一种脚本语言,可以用来创建动态更新内容,控制多媒体,制作图片动画效果。
JavaScript使用方法
内部JavaScript
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JavaScript</title>
<script>
/*内部式嵌入*/
var str="富贵险中求";
console.log(str);
</script>
</head>
<body>
<h1>JavaScript语言的使用</h1>
</body>
</html>
外部式JavaScript
<script type = "text/javascript" src = "my.js"></script>
内联式JavaScript处理器
将js代码写入html代码中,如在html标签的时间中或超链接里。
<button onclick="alert('Hello World')">Hello World</button>
JavaScript输出方式:
<script>
window.alert("Hello World")//弹出警示框
document.write("页面输出的方式")//方法将内容写到html文档中
document.getElementById("did").innerHTML="div层中的输出"; //写入到HTML元素
console.log("输出到控制台")//写入到浏览器的控制台
</script>
undefined 和null的区别
typeof undefined //undefined
typeof null //object
null === undefined //false (首先比较两边数据类型是否相等,再比较数值)
null == undefined //true
对象定义和使用
原始方式
<script>
var person = new Object();
person.name = "张三";
person.age = 15;
person.say=function(){
console.log("name: "+this.name+"age: "+this.age);
}
person.say();
</script>
工厂方式
<script>
function createObject(name,age){
var person = new Object();
person.name = name;
person.age = age;
person.say = function(){
console.log("name:"+name+" age:"+age);
}
return person;
}
var p1 = createObject("张三",14);
console.log(p1.name);
console.log(p1.age);
var p2 = createObject("李四",15);
console.log(p2.name);
console.log(p2.age);
</script>
使用自定义构造函数创建对象
<script>
function Person(name,age){
this.name = name;
this.age = age;
this.say = function(){
console.log(name+":"+age);
}
}
var p1 = new Person("张三",14);
var p2 = new Person("李四",15);
p1.say();
p2.say();
</script>
直接创建自定义对象
<script>
var person ={name:"张三", age:14,say:function(){
console.log(this.name+":"+this.age);
}};
console.log(person.name);
console.log(person.age);
person.say();
</script>