Javascript基础

最新推荐文章于 2022-11-23 17:32:46 发布

One-Direction

最新推荐文章于 2022-11-23 17:32:46 发布

阅读量167

点赞数

分类专栏： JavaScript 文章标签： JavaScript

本文链接：https://blog.csdn.net/BUCTOJ/article/details/97651757

版权

JavaScript 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

Javascript可用于HTML和WEB，更可广泛用于服务器，PC，笔记本电脑，平板电脑和智能手机等设备，是脚本语言，是一种轻量级的编程语言。是可插入HTML页面的编程代码，插入HTML页面后，可由所有的现代浏览器执行。

输出：
- 弹出警告框： window.alert()
- 操作HTML元素：document.getElementById(id)访问某个HTML元素，innerHTML获取或插入元素内容
- 写到HTML文档：document.write()向文档输出写内容，若在文档已完成加载后执行，页面会被覆盖
- 写到控制台：console.log() 打开调试模式，调试窗口中点击console菜单
保留字：
abstract,boolean,break,byte,case,catch,char,class,const,continue,debugger,default,delete,do,,double,else,enum,export,extends,false,final,finally,float,for,function,goto,if,implements,import,in,instanceof,int,interface,let,long,native,new,null,package,private,protected,public,return,short,static,super,switch,synchronized,this,throw,throws,transient,true,try,typeof,var,void,volatile,while,with
函数用function关键字声明，变量用var关键字声明
把值赋给尚未声明的变量，该变量将自动作为window(JS中的顶层对象)的一个属性，非严格模式下给未声明变量赋值创建的全局变量，是全局对象的可配置属性，可以删除
常见的HTML事件
- onchang：HTML元素改变
- onclick：用户点击HTML元素
- onmouseover：用户在一个HTML元素上移动鼠标
- onmouseout：用户从一个HTML元素上移开鼠标
- onkeydown：用户按下键盘按键
- onload：浏览器已完成页面的加载
String对象
- 属性
  - constructor 对创建该对象的函数的引用
  - length 字符串的长度(原始值如"john"没有属性，因其不是对象)
  - prototype 允许向对象添加属性和方法
- 方法
  - charAt() 返回在指定位置的字符
  - concat() 连接两个或更多字符串，并返回新的字符串
  - indexOf() 返回某个指定的字符串值在字符串中首次出现的位置
  - match() 查找到一个或多个正则表达式的匹配
  - replace() 在字符串中查找匹配的子串，并替换与正则表达式匹配的子串
  - search() 查找与正则表达式相匹配的值
  - substr()/substring 从起始索引号提取指定数目字符/提取两个指定索引号之间的字符
  - tirm() 去除字符串两边的空白
  - toLowerCase()/toUpperCase() 把字符串转换为小写/大写
Array对象
- 属性
  - constructor 返回对创建此对象的数组函数的引用。
  - length 设置或返回数组中元素的数目。
  - prototype 使您有能力向对象添加属性和方法。
- 方法
  - slice() 可从已有的数组中返回选定的元素。
  - shift() 把数组的第一个元素从其中删除，并返回第一个元素的值。
  - concat()连接两个或更多的数组，并返回结果。
  - join() 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。
  - pop() 删除并返回数组的最后一个元素
  - push() 向数组的末尾添加一个或更多元素，并返回新的长度。
  - reverse() 颠倒数组中元素的顺序。
  - shift() 删除并返回数组的第一个元素
  - slice() 从某个已有的数组返回选定的元素
  - sort() 对数组的元素进行排序
  - splice() 删除元素，并向数组添加新元素。
  - toSource() 返回该对象的源代码。
  - toString() 把数组转换为字符串，并返回结果。
  - toLocaleString() 把数组转换为本地数组，并返回结果。
  - unshift() 向数组的开头添加一个或更多元素，并返回新的长度。
  - valueOf() 返回数组对象的原始值
Date对象
- 属性
  - constructor 返回对创建此对象的 Date 函数的引用。
  - prototype 使您有能力向对象添加属性和方法。
- 方法
  - Date() 返回当日的日期和时间。
  - getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)。
  - getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)。
  - getMonth() 从 Date 对象返回月份 (0 ~ 11)。
  - getFullYear() 从 Date 对象以四位数字返回年份。
  - getYear() 请使用 getFullYear() 方法代替。
  - getHours() 返回 Date 对象的小时 (0 ~ 23)。
  - getMinutes() 返回 Date 对象的分钟 (0 ~ 59)。
  - getSeconds() 返回 Date 对象的秒数 (0 ~ 59)。
  - getMilliseconds() 返回 Date 对象的毫秒(0 ~ 999)。
  - getTime() 返回 1970 年 1 月 1 日至今的毫秒数。
  - getTimezoneOffset() 返回本地时间与格林威治标准时间 (GMT) 的分钟差。
  - getUTCDate() 根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。
  - getUTCDay() 根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。
  - getUTCMonth() 根据世界时从 Date 对象返回月份 (0 ~ 11)。
  - getUTCFullYear() 根据世界时从 Date 对象返回四位数的年份。
  - getUTCHours() 根据世界时返回 Date 对象的小时 (0 ~ 23)。
  - getUTCMinutes() 根据世界时返回 Date 对象的分钟 (0 ~ 59)。
  - getUTCSeconds() 根据世界时返回 Date 对象的秒钟 (0 ~ 59)。
  - getUTCMilliseconds() 根据世界时返回 Date 对象的毫秒(0 ~ 999)。
  - parse() 返回1970年1月1日午夜到指定日期（字符串）的毫秒数。
  - setDate() 设置 Date 对象中月的某一天 (1 ~ 31)。
  - setMonth() 设置 Date 对象中月份 (0 ~ 11)。
  - setFullYear() 设置 Date 对象中的年份（四位数字）。
  - setYear() 请使用 setFullYear() 方法代替。
  - setHours() 设置 Date 对象中的小时 (0 ~ 23)。
  - setMinutes() 设置 Date 对象中的分钟 (0 ~ 59)。
  - setSeconds() 设置 Date 对象中的秒钟 (0 ~ 59)。
  - setMilliseconds() 设置 Date 对象中的毫秒 (0 ~ 999)。
  - setTime() 以毫秒设置 Date 对象。
  - setUTCDate() 根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。
  - setUTCMonth() 根据世界时设置 Date 对象中的月份 (0 ~ 11)。
  - setUTCFullYear() 根据世界时设置 Date 对象中的年份（四位数字）。
  - setUTCHours() 根据世界时设置 Date 对象中的小时 (0 ~ 23)。
  - setUTCMinutes() 根据世界时设置 Date 对象中的分钟 (0 ~ 59)。
  - setUTCSeconds() 根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。
  - setUTCMilliseconds() 根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。
  - toSource() 返回该对象的源代码。
  - toString() 把 Date 对象转换为字符串。
  - toTimeString() 把 Date 对象的时间部分转换为字符串。
  - toDateString() 把 Date 对象的日期部分转换为字符串。
  - toGMTString() 请使用 toUTCString() 方法代替。
  - toUTCString() 根据世界时，把 Date 对象转换为字符串。
  - toLocaleString() 根据本地时间格式，把 Date 对象转换为字符串。
  - toLocaleTimeString() 根据本地时间格式，把 Date 对象的时间部分转换为字符串。
  - toLocaleDateString() 根据本地时间格式，把 Date 对象的日期部分转换为字符串。
  - UTC() 根据世界时返回 1970 年 1 月 1 日到指定日期的毫秒数。
  - valueOf() 返回 Date 对象的原始值。
typeof 检测变量的数据类型(数组是一种特殊的对象类型，返回Object）
null 表示一个空对象引用，用typeof检测返回的是Object
undefined 是一个没有设置值的变量，用typeof返回的是undefined
null和undefined值相等但是类型不相等

For循环:用于循环对象属性

for…in

var a = ['A', 'B', 'C'];
for (var i in a) {
 alert(i); // '0', '1', '2'
 alert(a[i]); // 'A', 'B', 'C'
}

for…of

var a = ['A', 'B', 'C'];
var s = new Set(['A', 'B', 'C']);
var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]);
for (var x of a) { // 遍历Array
 alert(x);//'A', 'B', 'C'
}
for (var x of s) { // 遍历Set
 alert(x);//'A', 'B', 'C'
}
for (var x of m) { // 遍历Map
 alert(x[0] + '=' + x[1]);//1='x',2='y',3='z'
}

for … in循环由于历史遗留问题，它遍历的实际上是对象的属性名称。一个Array数组实际上也是一个对象，它的每个元素的索引被视为一个属性。
当我们手动给Array对象添加了额外的属性后，for … in循环将带来意想不到的意外效果：
```
  var a = ['A', 'B', 'C'];
  a.name = 'Hello';
  for (var x in a) {
   alert(x); // '0', '1', '2', 'name'
  }
```
for … in循环将把name包括在内，但Array的length属性却不包括在内。
for … of循环则完全修复了这些问题，它只循环集合本身的元素：
```
  var a = ['A', 'B', 'C'];
  a.name = 'Hello';
  for (var x of a) {
   alert(x); // 'A', 'B', 'C'
  }
```

continue只能用在循环中。break不带标签引用只能用在循环或switch中；带标签可跳出任何代码块

constructor 属性返回所有JS变量的构造函数

<script type="text/javascript">

var test=new Array();

if (test.constructor==Array)
{
document.write("This is an Array");
}
if (test.constructor==Boolean)
{
document.write("This is a Boolean");
}
if (test.constructor==Date)
{
document.write("This is a Date");
}
if (test.constructor==String)
{
document.write("This is a String");
}

</script>

输出：This is an Array

<script type="text/javascript">

 function employee(name,job,born)
 {
 this.name=name;
 this.job=job;
 this.born=born;
 }
 
 var bill=new employee("Bill Gates","Engineer",1985);
 
 document.write(bill.constructor);
 
 </script>
 
 输出：
 function employee(name, job, born)
 {this.name = name; this.job = job; this.born = born;}

更多的constructor知识请参考：
https://blog.csdn.net/cc18868876837/article/details/81211729
全局方法 Number() 可以将字符串转换为数字。

类型转换

字符串包含数字(如 “3.14”) 转换为数字 (如 3.14).

空字符串转换为 0。

其他的字符串会转换为 NaN (不是个数字)。
Number("3.14")    // 返回 3.14
Number(" ")       // 返回 0
Number("")        // 返回 0
Number("99 88")   // 返回 NaN

一元运算符+可用于将变量转换为数字

var y="5";
var x= +y;
console.log(Object(x));

输出：Number { 5 }

如果变量不能转换，它仍然是数字，值为NaN，表示不是一个数字

var y = "John";
var x = + y;
document.getElementById("demo").innerHTML =
	typeof x + "<br>" + x;

输出：
number
NaN

当 JavaScript 尝试操作一个 “错误” 的数据类型时，会自动转换为 “正确” 的数据类型。

以下输出结果不是你所期望的：

5 + null    // 返回 5         null 转换为 0
"5" + null  // 返回"5null"   null 转换为 "null"
"5" + 1     // 返回 "51"      1 转换为 "1" 
"5" - 1     // 返回 4         "5" 转换为 5

自动转换为字符串

当你尝试输出一个对象或一个变量时 JavaScript 会自动调用变量的 toString() 方法：

document.getElementById("demo").innerHTML = myVar;

myVar = {name:"Fjohn"}  // toString 转换为 "[object Object]"
myVar = [1,2,3,4]       // toString 转换为 "1,2,3,4"
myVar = new Date()      // toString 转换为 "Fri Jul 18 2014 09:08:55 GMT+0200"

数字和布尔值也经常相互转换：

myVar = 123             // toString 转换为 "123"
myVar = true            // toString 转换为 "true"
myVar = false           // toString 转换为 "false"

不同的数值转换为数字(Number), 字符串(String), 布尔值(Boolean):

原始值	转换为数字	转换为字符串	转换为布尔值
“”	0	“”	false
[]	0	“”	true
[20]	20	“20”	true
{}	NaN	“[object Object]”	true
null	0	“null”	false
undefined	NaN	“undefined”	false
Date()	1564411011950	Mon Jul 29 2019 22:36:51 GMT+0800	true
[“Runoob”,“Google”]	NaN	“Runoob,Google”	true
“000”	0	“000”	true

One-Direction

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Javascript基础

Javascript可用于HTML和WEB，更可广泛用于服务器，PC，笔记本电脑，平板电脑和智能手机等设备，是脚本语言，是一种轻量级的编程语言。是可插入HTML页面的编程代码，插入HTML页面后，可由所有的现代浏览器执行。输出：弹出警告框： window.alert()操作HTML元素：document.getElementById(id)访问某个HTML元素，innerHTML获取或...
复制链接

扫一扫

专栏目录