黄阿信的个人博客

前言

JavaScript 是一种脚本，一门编程语言，它可以在网页上实现复杂的功能，网页展现给你的不再是简单的静态信息，而是实时的内容更新，交互式的地图，2D/3D 动画，滚动播放的视频等等。构建web前端，JavaScript 怎能缺席。它是标准 Web 技术蛋糕的第三层，其中 HTML 和 CSS 我们已经在前面有了初步学习。

使用方法

前面学习CSS中，我们知道CSS的使用方法有三种：元素内嵌、文档内嵌、导入外部。这里的JavaScript也有类似的方法：元素内嵌、文档内嵌、导入外部：

元素内嵌

<input type="button" value="这是一个按钮" onclick="alert('你好')">

文档内嵌

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script>
        alert("hello world");
    </script>
</head>

导入外部

//新建一个test.js
alert("test");
//在HTML文件中的head标签下引入
<script src="test.js"></script>

输出内容

可以用alert()函数或者document.write()，这前者是弹出式，后者直接在网页中显示，还可以配合标签来使用

<script>
    var title = "这是一级标题";
    document.write("<h1>"+title+"</h1>");
</script>

还有用console.log()在控制台控制输出，一般用于程序员调试。

输入内容

获取用户输入，我们在HTML的表单中已经学习过，如果用JavaScript也可以实现，prompt()方法用于显示一个带有提示信息，并且用户可以输入的对话框。

prompt(text,defaultText);

参数	描述
text	可选。要在对话框中显示的提示信息（纯文本）
defaultText	可选。默认的输入文本。

如

<script>
	var inPut = prompt("请输入你的内容","");
	alert("您输出的是\n"+inPut);
</script>

对象

JavaScript跟其他面向对象语言一样，有对象的属性，关于详细的面向对象，这里有着详细的介绍

使用对象字面量创建对象

var student = {
    ID: 11111111,
    name: "学生名字",
    age: 18,
    sayHello: function () {
        console.log("hello world");
    }
};
/* 两种方法引用对象属性 */
alert(student.ID);
alert(student["ID"]);

使用new object()方式创建

var student = new Object(); //创建了一个空对象
student.ID = 123;
student.name = "学生姓名";
student.age = 18;
student.sayHello = function () {
	console.log("hello world");
};

利用构造函数方式创建

function Creatstudent(s_ID,s_name,s_age){ //构造函数名一般首字母大写
    this.ID = s_ID;
    this.name = s_name;
    this.age = s_age;
    this.sayHello = function(){
        console.log("hello");
    }
    // 没有返回值
}
var student = new Creatstudent(12345,"学生姓名",18);

遍历对象的内容

有的时候我们想获取对象的全部属性，我们可以用对象+“.”+属性名来获取，这种方法对于属性少的对象来说固然奏效，但是假如我的对象有一千个、一万个属性呢？（当然了这只是一个假设，我们自定义的对象一般不会有这么多的属性吧）上面的方法估计就有些吃力了吧！因此我们需要换一种方式来遍历。

var key;
for(key in student){
    console.log(key+":"); //循环一次 得到的是属性名
    // console.log(student.key); 不得使用该方法 因此该方法返回的是undefined
    console.log(student[key]);
}

内置对象

JavaScript中对象分为三种：自定义对象、内置对象、浏览器对象。
前面两种对象属于ECMAScript，第三个是JavaScript独有的
内置对象是官方定义，供开发人员使用的对象，它能帮助开发者快速开发，而不必要在意背后的工作原理（当然了喜欢钻研也可以）。
JavaScript提供了大量的内置对象，如Math、Date、Array、String等。

为了了解如何使用内置对象，我们需要去官网查阅官方文档，例如，根据官方文档，我们可以知道获取时间的方法是

function showTime() {
    nowtime = new Date();
    year = nowtime.getFullYear();
    month = nowtime.getMonth() + 1;
    date = nowtime.getDate();
    console.log(year + "年" + month + "月" + date + "日" + nowtime.toLocaleTimeString());
}
// 更新时间间隔
setInterval("showTime()", 1000);

JavaScript语法一

前言

使用方法

输出内容

输入内容

对象

遍历对象的内容

内置对象