JS基础一-入门知识
一、什么是JavaScript
JavaScript是一种基于对象和事件驱动并具有安全性能的解释性脚本语言。JavaScript不需要编译,直接嵌入在HTTP页面中,把静态页面转变成支持用户交互并响应应用事件的动态页面。
二、JavaScript特点
1、解释性(脚本语言,采用小程序段的方式实现编程)
2、基于对象(许多功能来自于脚本环境中对象的方法与脚本的相互作用)
3、事件驱动(JavaScript可以以事件驱动的方式直接对客户端的输入做出响应,无须经过服务器端)
4、安全性(不允许访问本地硬盘,不能将数据写到服务器上,并且不允许对网络文档进行修改和删除,只能通过浏览器实现信息浏览和动态交互)
5、跨平台(JavaScript依赖于浏览器本身,与操作系统无关)
三、JavaScript语法
1、JavaScript区分大小写
2、每行结尾的分号可有可无
3、变量是弱类型(如定义变量时,只使用var运算符就可以将变量初始化为任意值)
4、单行注释 (//)与多行注释(/* 。。。。*/)
四、JavaScript数据类型
JavaScript的数据类型主要有6种:数值型,字符型,布尔型(boolean),转义字符,空值(NULL),未定义(undefined)
1、整型
JavaScript的整型数据可以是正整数、负整数和0
//表示十进制729
//表示八进制的71
0x9405B //表示十六进制的9405B
2、浮点型
3.1415926 //采用标准方法表示
1.6E5 //采用科学记数法表示,代表1.6*10^5
3、字符型
字符型数据时使用单引号或双引号括起来的一个或多个字符
‘hello,我是JavaScript’
“hello,我是Java”
注意:JavaScript和Java不同,它没有char数据类型,要表示单个字符,必须使用长度为1的字符串。
4、boolean
5、转义字符 JavaScript常用的转义字符
转义字符 | 描述 | 转义字符 | 描述 |
\b | 退格 | \n | 换行 |
\f | 换页 | \t | Tab符 |
\r | 回车符 | \' | 单引号 |
\" | 双引号 | \\ | 反斜杠 |
\xnn | 十六进制代码nn表示的字符 | \unnnn | 十六进制代码nnnn表示Unicode字符 |
\0nnn | 八进制代码nn表示的字符 |
6、未定义值
当使用一个并未声明的变量,或者使用一个已经声明但没有赋值的变量,将返回未定义值(undefined)
说明:JavaScript中还有一种特殊类型的数字常量NaN,即“非数字”。当在程序中由于某种原因发生计算错误后,将产生一个没有意义的数字,此时JavaScript返回的数值就是NaN。
五、变量的定义及使用
变量是指程序中一个已经命名的存储单元,其主要作用就是为数据提供存放信息的容器。
1、变量命名规则
a、变量名由字母、数字或下划线组成,但必须以字母或下划线开头
b、变量名中不能有空格,加号,减号,逗号等符号
c、不能使用JavaScript关键字
d、JavaScript严格区分大小写
2、变量的声明方法
使用关键字var声明变量,其语法格式如下
var sun;
可以使用关键字var同时声明多个变量
可以在声明变量的同时同时对其进行赋值,即初始化。
如果声明了变量,但未对其赋值,其默认值为undefined
JavaScript采用弱类型,所以在声明变量时不需要指定变量的类型,而变量的类型将根据变量的值来确定
3、变量的作用域
根据变量作用域可以将变量分为全局变量和局部变量两种。
<script>
var sun = "hello,博客园"; //变量在函数外声明,作用整个脚本的代码
function sun1(){
var url="www.baidu.com"; //变量在函数内声明,只作用于该函数体
alert(sun+sun1);
}
</script>
六、事件处理
1、什么是事件处理程序?
如用户单击按钮时将触发按钮的onclick事件等。事件处理程序则是用于响应某个事件而执行的处理程序。
JavaScript的常用事件
事件 | 何时触发 |
onclick | 单击鼠标左键时触发 |
ondblclick | 双击鼠标左键时触发 |
onfocus | 任何元素和窗口本身获得焦点时触发 |
onmousemove | 鼠标在某个元素上移动时持续触发 |
onmouseout | 将鼠标从指定的元素上移开时触发 |
onmouseover | 将鼠标移到某个元素上时触发 |
onload |
页面完全载入后,在window对象触发; 所有框架都载入后,在框架集上触发 <img>标记指定的图像完全载入后,在其触发 |
2、事件处理程序的调用
JavaScript中调用
<input name = "bt_sun" type = "button" value = "保存">
<script>
var b_sun = document.getElementById("bt_sun");
b_sun.onclick = function(){
alert("我点击了这个按钮");
}
</script>
注意:在上面的代码中,要将<input name = "bt_sun" type = "button" value = "保存">放在JavaScript代码的上方,否则将弹出“b_sun”为空或不是对象的错误提示。
在JavaScript中指定事件处理程序时,事件必须为小写,才能正确响应事件。
在HTML中
在HTML中分配事件处理程序,只需要在HTML标记中添加响应的事件,并且在其中指定的代码或函数名即可。
<input name = "bt_sun" type = "button" value = "保存" onclick="alert("我点击了按钮");">
七、常用对象
1、Window对象
window对象即浏览器对象,是一个全局对象,是所有对象的顶级对象。Window对象同Math对象一样,直接使用“对象名.成员”的格式来访问其属性或方法。
属性 | 描述 |
document | 对窗口或框架中含有文档的Document对象的只读引用 |
length | 窗口或框架包含的框架个数 |
name | 用于存放窗口对象的名称 |
screen | 对窗口或框架的Screen对象的只读引用,提供屏幕尺寸,颜色深度等信息 |
top | 表示最顶层的浏览器窗口 |
方法 | 描述 |
alert() | 弹出一个警告对话框 |
close() | 关闭窗口 |
open() | 打开一个新窗口 |
confirm() | 显示一个确认对话框,单击确认按钮时返回true,否则返回false |
如:
windowVar = window.open(url,windowname[,location]);
open()方法用于打开一个新窗口,并在窗口中装载指定URL地址的网页,以上代码是open()的语法格式。
2、String对象
string对象是动态对象,需要创建对象实例后才能引用其属性和方法。
3、Date对象的方法
Date对象没有提供直接访问的属性,只具有获取,设置日期和时间的方法
方法 | 描述 | 示例 |
getFullYear() | 返回Date对象的年份,用4位数表示,采用本地时间或世界时 | new Date().getFullYear(); //返回值为2018/09/11 |
getMonth() | 返回Date对象中的月份(0~11),采用本地时间或世界时 | new Date().getMonth(); //返回值为9 |
getDate() | 返回Date对象中的日(1~31),采用本地时间或世界时 | new Date().getDate(); //返回值为11 |
getDay() | 返回Date对象中的星期(0~6),采用本地时间或世界时 | new Date().getDay(); //返回值为2 |
getHours() | 返回Date对象中的小时数(0~23),采用本地时间或世界时 | new Date().getHours(); //返回值为21 |
JS基础一-入门知识的更多相关文章
- 谈谈 React.js 的核心入门知识
近来React.js变得越来越流行,本文就来谈一谈React.js的入门实践,通过分析一些常用的概念,以及提供一些入门 的最佳编程编程方式,仅供参考. 首先需要搞懂的是,React并不是一个框架,Re ...
- Vue.js 基础快速入门
Vue.js是一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的.Vue.js提供了简洁.易于理解的API,使得我们能够快速地上手并使用Vue.js 如果之前已经习惯了用jQue ...
- 二、JavaScript语言--JS基础--JavaScript入门篇
1.如何插入JS 使用<script>标签在HTML网页中插入JavaScript代码.注意, <script>标签要成对出现,并把JavaScript代码写在<scri ...
- Web3D编程入门总结——WebGL与Three.js基础介绍
/*在这里对这段时间学习的3D编程知识做个总结,以备再次出发.计划分成“webgl与three.js基础介绍”.“面向对象的基础3D场景框架编写”.“模型导入与简单3D游戏编写”三个部分,其他零散知识 ...
- Node.js基础知识
Node.js入门 Node.js Node.js是一套用来编写高性能网络服务器的JavaScript工具包,一系列的变化由此开始.比较独特的是,Node.js会假设在POSIX环境下运行 ...
- three.js基础前置知识
这一节是纯理论知识,用于介绍three.js的入门概念,也就是开发前需要准备的理论基础. 一,三剑客 当然就是scene,camera,renderer这三个基本要素. scene是一个用于容纳三维空 ...
- js基础知识梳理(最简版)
基础的JavaScript知识,只放XMind截图.小白 JS01 JS02 JS03 最基础的js知识--!
- [JS复习] JS 基础知识
项目结尾,空闲时间,又把<JS 基础知识> 这本书过了一遍,温故知新后,很多知其然不知其所以然的内容 豁然开朗. [1. 用于范围的标签] display :inline or bloc ...
- HTML+CSS+JS基础知识
HTML+CSS+JS基础知识 目录 对HTML+CSS+JS的理解 基础知识 对HTML+CSS+JS的理解 基础知识 插入样式表的三种方式 外部样式表:<link rel="sty ...
随机推荐
- Centos7.0根分区扩容
添加一块10G的硬盘 查看磁盘大小 # df -Th 查看物理卷组 # vgdisplay 查看逻辑卷 # lvs 查看磁盘信息 # fdisk -l 对添加的10G硬盘分区 # fdisk /dev ...
- python:数据类型set
一.集合 集合是无序的,不重复的数据集合,它里面的元素是可哈希的(不可变数据类型),但是集合本身是不可哈希(所以集合做不了字典的键)的.以下是集合最重要的两点: 去重,把一个列表变成集合,就自动去重了 ...
- Git配置SSH Key
最近看到很多人在配置Git时,遇到很问题,网上教程千篇一律.这儿自己单独记录一份. Git配置SSH Key 1.检查本机是否有ssh key设置,切换到.ssh目录 $ cd ~/.ssh 或cd ...
- Android短信收发(二)
接收SMS类,代码如下 //for receive SMS private SmsReceiver mSmsReceiver; @Override protected void onResume() ...
- python多进程与服务器并发
进程 什么是进程 进程:正在进行的一个过程或者说一个任务.而负责执行任务则是cpu. 进程与程序的区别 程序仅仅只是一堆代码而已,而进程指的是程序的运行过程. 并发与并行 无论是并行还是并发,在用户看 ...
- MySQL免安装配置(亲测过,请放心借鉴)
下载地址:https://dev.mysql.com/downloads/mysql 1.mysqld --initialize-insecure 初始化 2.mysqld install 安装服 ...
- linux tomcat启动后无法访问
先是按网上资料先下载安装包,然后上传到linux,启动后发现8080端口并未被占用.查了很多资料,不知道神马原因了.最后用yum安装后就可以访问了. 教程如下: 本教程介绍在CentOS 7服务器上使 ...
- web前端全栈学习之路
web前端全栈学习之路 --- 陆续更新中 一.HTML相关 1.HTML常用标签:http://www.cnblogs.com/wyb666/p/8733699.html 2.HTML5基础: 3. ...
- if 判断语句
if 条件:if语句块当条件成立的时候会执行if语句块, 如果条件不成立. 不执行语句块的内容 例: money = int(input("请输入你兜里的钱:")) # 300 i ...
- CentOS7中替换安装python3.7.0
python3.7的安装包可从官网下载上传到主机,也可以用wget直接下载. [root@xxx ~]# cd /usr/local/src/[root@xxx src]# wget https:// ...