js day(1) 基础知识

一、js基础知识

1.1 换行

您可以在文本字符串中使用反斜杠对代码行进行换行。下面的例子会正确地显示：

document.write("你好 \世界!");

1.2 js变量

变量必须以字母开头
变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）
变量名称对大小写敏感（y 和 Y 是不同的变量）

1.3 js数据类型

值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。
引用数据类型：对象(Object)、数组(Array)、函数(Function)。

• 数组

var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";

或者 (condensed array):
var cars=new Array("Saab","Volvo","BMW");

• 对象

var person={
firstname : "John",
lastname  : "Doe",
id        :  5566
};

对象的两种寻址方式
name=person.lastname;
name=person[“lastname”];

• Undefined 和 Null
  Undefined 这个值表示变量不含有值。
  可以通过将变量的值设置为 null 来清空变量。
• 声明变量类型

当您声明新变量时，可以使用关键词 “new” 来声明其类型：
var carname=new String;
var x= new Number;
var y= new Boolean;
var cars= new Array;
var person= new Object;

1.4 对象属性

可以说 “JavaScript 对象是变量的容器”。
但是，我们通常认为 “JavaScript 对象是键值对的容器”。
键值对通常写法为 name : value (键与值以冒号分割)。
键值对在 JavaScript 对象通常称为 对象属性。

1.5 对象方法

对象的方法定义了一个函数，并作为对象的属性存储。
对象方法通过添加 () 调用 (作为一个函数)。
该实例访问了 person 对象的 fullName() 方法:

1.6 js函数

• 退出函数

function myFunction(){
return;
}

• 全局 JavaScript 变量

在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。
JavaScript 变量的生存期

• JavaScript 变量的生命期从它们被声明的时间开始。

局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除。

• 向未声明的 JavaScript 变量分配值

这条语句：
carname=“Volvo”;
将声明 window 的一个属性 carname。
非严格模式下给未声明变量赋值创建的全局变量，是全局对象的可配置属性，可以删除。

<script>
demo2 = 3;
function myFunction(){
	document.write(window.demo2);
	console.log(delete demo2);
}
document.getElementById("demo").innerHTML=myFunction();
</script>

• 全局部变量
  在 HTML 中, 全局变量是 window 对象: 所有数据变量都属于 window 对象。

1.7 常见的事件

onchange	HTML 元素改变
onclick	用户点击 HTML 元素
onmouseover	用户在一个HTML元素上移动鼠标
onmouseout	用户从一个HTML元素上移开鼠标
onkeydown	用户按下键盘按键
onload	浏览器已完成页面的加载

1.8 转义字符

’	单引号
"	双引号
\	反斜杠
\n	换行
\r	回车
\t	tab(制表符)
\b	退格符
\f	换页符

1.9 字符串

var x = "John";
var y = new String("John");
typeof x // 返回 String
typeof y // 返回 Object 

不要创建 String 对象。它会拖慢执行速度，并可能产生其他副作用：

1.10 JavaScript == 与 === 区别

1、对于 string、number 等基础类型，== 和 === 是有区别的
a）不同类型间比较，== 之比较 “转化成同一类型后的值” 看 “值” 是否相等，=== 如果类型不同，其结果就是不等。
b）同类型比较，直接进行 “值” 比较，两者结果一样。
2、对于 Array,Object 等高级类型，== 和 === 是没有区别的
进行 “指针地址” 比较
3、基础类型与高级类型，== 和 === 是有区别的
a）对于 ，将高级转化为基础类型，进行 “值” 比较
b）因为类型不同，= 结果为 false
4、!= 为 == 的非运算，!== 为 === 的非运算

二、循环

2.1 for/in循环

• 便利对象值

var x;
var person ={
	name:"ybx",
	age:12
};
function myMethod(){
	for(x in person){
		document.write(x + " " + person[x] + '<br>');
	}
}
myMethod();

name ybx
age 12

2.2 continue,break

• 带有标签的跳出

list:
{
    document.write(cars[0] + "");
    document.write(cars[1] + "");
    document.write(cars[2] + "");
    break list;
    document.write(cars[3] + "");
    document.write(cars[4] + "");
    document.write(cars[5] + "");
}

2.3 typeof

typeof [1,2,3,4]             // 返回 object
typeof {name:'John', age:34} // 返回 object 
typeof null    //返回object

任何变量都可以通过设置值为 undefined 来清空。 类型为 undefined.

2.4 undefined和null的区别

 typeof undefined             // undefined
typeof null                  // object
null === undefined           // false
null == undefined            // true

2.5 类型

NaN 的数据类型是 number
数组(Array)的数据类型是 object
日期(Date)的数据类型为 object
null 的数据类型是 object
未定义变量的数据类型为 undefined

2.6 属性

• constructor
  constructor 属性返回所有 JavaScript 变量的构造函数。
• 查看对象是否为数组

function isArray(myArray) {
    return myArray.constructor.toString().indexOf("Array") > -1;
} 

2.7 正则表达式

• 使用字符串方法
  在 JavaScript 中，正则表达式通常用于两个字符串方法 : search() 和 replace()。
  search() 方法 用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。
  replace() 方法 用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
• test方法

var patt = /e/;
patt.test("The best things in life are free!"); 

• exec

使用 exec()
exec() 方法是一个正则表达式方法。
exec() 方法用于检索字符串中的正则表达式的匹配。
该函数返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。
以下实例用于搜索字符串中的字母 “e”:

2.8 异常体系

• throw可以直接抛出字符串

    try { 
        if(x == "")  throw "值为空";
        if(isNaN(x)) throw "不是数字";
        x = Number(x);
        if(x < 5)    throw "太小";
        if(x > 10)   throw "太大";
    }
    catch(err) {
        message.innerHTML = "错误: " + err;
    }

2.9 JS调试

• console.log()
• debugger关键字

debugger 关键字
debugger 关键字用于停止执行 JavaScript，并调用调试函数。
这个关键字与在调试工具中设置断点的效果是一样的。
如果没有调试可用，debugger 语句将无法工作。
开启 debugger ，代码在第三行前停止执行。

2.10 变量提升

JavaScript 中，变量可以在使用后声明，也就是变量可以先使用再声明。

三、关键字

3.1 this关键字

• 在方法中，this表示方法所属的对象。
• 在事件中，this表示接收事件的元素。
• 单独使用 this，则它指向全局(Global)对象。
• 在 HTML 事件句柄中，this 指向了接收事件的 HTML 元素
• apply 和 call 允许切换函数执行的上下文环境（context），即 this 绑定的对象，可以将 this 引用到任何对象。

3.2 let和const

let 声明的变量只在 let 命令所在的代码块内有效。

const 声明一个只读的常量，一旦声明，常量的值就不能改变。

3.3 html中使用全局变量

HTML 代码中使用全局变量
在 JavaScript 中, 全局作用域是针对 JavaScript 环境。
在 HTML 中, 全局作用域是针对 window 对象。
使用 var 关键字声明的全局作用域变量属于 window 对象:

3.4 js和json

• js格式字符串

var text = '{ "sites" : [' +
'{ "name":"Runoob" , "url":"www.runoob.com" },' +
'{ "name":"Google" , "url":"www.google.com" },' +
'{ "name":"Taobao" , "url":"www.taobao.com" } ]}';

• 用 JavaScript 内置函数 JSON.parse() 将字符串转换为 JavaScript 对象:

var obj = JSON.parse(text);

• js和json转换的函数

JSON.parse()	用于将一个 JSON 字符串转换为 JavaScript 对象。
JSON.stringify()	用于将 JavaScript 值转换为 JSON 字符串。

3.5 javascript:void(0)

• 操作符指定要计算一个表达式但是不返回值。

在这里插入代码片

• href="#"与href="javascript:void(0)"的区别

href="#pos"可以调到id为pos标签的位置