1.1 系统函数
系统函数又叫javascript内置顶层函数。
内置：ECMAscript 自带的函数，ECMAscript将我们常用的一些功能封装起来，我们不需要知道他是怎么实现的，只需要知道怎么调用即可。
顶层，在页面当中的任何地方都可以调用。
1.1.1 javascript内置顶层函数
内置顶层函数 有很多，我们举例是最常用的9个。
1.Number() 将字符串转换成数值类型
{
// 1.Number() 将字符串转换成数值类型
let n ='12';
let m= '34';
n= Number(n);
m=Number(m);
console.log(typeof n, typeof m);
console.log(n+m);
}
预览：
2.parseInt() 将字符串转换为整型
{
//2.parseInt() 将字符串转换为整型
let x='1.3';
let y='2';
x=parseInt(x);
y=parseInt(y);
console.log(typeof x, typeof(y));
console.log(x);
console.log(x+y);
}
预览：
3.parseFloat() 将字符串转换为小数（浮点型数）
{
// 3.parseFloat() 将字符串转换为小数（浮点型数）
let x='1.3';
let y='2';
x=parseFloat(x)
y=parseFloat(y)
console.log(typeof x, typeof(y));
console.log(x+y);
}
预览：
4.isNaN() 判断一个数是否不能转为数值类型
{
// 4.isNaN() 判断一个数是否 不能 转为数值类型
// let a='123';//false
let a="abc"//true
let r=isNaN(a);
console.log(r);
}
预览：
5.eval() 用javascript语法来解析字符串内容
{
// 5.eval() 用javascript语法来解析字符串内容
console.log(eval(100+200/5));
let n,m;
n= '12.1';
m= '2';
console.log(eval(n+m));
}
预览：
6.String() 转换成字符串类型
{
// 6.String() 转换成字符串类型
let x=200;
let r=String(x)
console.log(r,typeof r);
}
预览：
7.Boolean()转换成布尔类型
{
// 7.Boolean()转换成布尔类型
let j=2;
let r=Boolean(j);
console.log(r ,typeof r);
}
预览：
8.isFinite() 判断一个数是否为有穷数字，如果不是有穷数字或不能转换成数值类型的数将会返回假，否则返回 真。
// isFinite() 判断一个数是否为有穷数字，如果不是有穷数字 或不能转换成数值类型的数将会返回假，否则返回真。
let a = 123
let r = isFinite(a)
console.log(r)
9.escape() 函数可对字符串进行编码
escape() 函数可对字符串进行编码，这样就可以在所有的计算机上读取该字符串。
该方法不会对 ASCII 字母和数字进行编码，也不会对下面这些 ASCII 标点符号进行编码 * @ - _ + . / 。其他所有的字符都会被转义序列替换。
提示： 使用 unescape() 方法对字符串进行解码。
注意：escape() 函数已经从 Web 标准中删除，所以尽量不使用该函数，可以使用 encodeURI或 encodeURIComponent代替。
escape() 函数 这个函数，对如下内容不转义，不编码。
（1） 不会对 ASCII 字母和数字进行编码
（2） 不会对 ASCII * @ - _ + . / 。
{
// escape(字符串) 将非字母、数字字符进行编码
let str = "http://www.baidu.com"
let r = escape(str)
console.log(r)
}
预览：
10.toFixed()方法可把Number四舍五入为指定小数位数的数字
{
//10. toFixed()方法可把Number四舍五入为指定小数位数的数字
let m=3.1415926;
let r=m.toFixed('2');
console.log(r);
}
预览：
转换成数值类型
Number() 转换成数值类型
A.如果是布尔值，false为0，true为1
B.如果是数字，转换成为本身。将无意义的后导0去掉。
C.如果是undefined 转换为NaN not a number
D.如果是字符串
1.如果字符串当中只有数字，转换为10进制(忽略前导0和后导0)
2.如果是有效的规范的浮点型，转换为浮点值(忽略前导0和后导0)
3.如果是空字符串，则转换为0
4.如果是其他的值，返回NaN
{
// 转换成数值类型
// let n=true; //1
let n=false; //0
n=Number(n);
console.log(n,typeof n);
}
预览：
1.2 自定义函数
1.2.1 函数定义
函数： 将完成某一特定功能的代码集合起来，可以重复使用的代码块。
优点：使程序更加简洁；逻辑更有条理；调用更方便；维护更加容易。
函数的声明方式(创建)
A.基本语法
function 关键字
function 函数名([参数1],[参数2]....){
函数体 [retrun] //返回值
}
例如：
{
// 申明函数
// a.基本语法
// 1.自定义
function msg(){
alert('上午好')
}
// 2.调用执行
msg();
msg();
}
B.字面量定义的形式(匿名函数)
var 变量 = function([参数1],[参数2]....){
函数体 [retrun] //返回值
}
例如：
{
// 申明函数
// b.字面量定义的形式(匿名函数)
let msg=function(){
alert('上午好')
}
// 调用执行
msg();
msg();
msg();
}
1.2.2 函数的调用方式
（1）通过括号来调用
函数名()
（2）通过触发事件来调用
对象.事件 = function (){}
#btn{
width: 100px;
height:100px;
cursor: pointer;
{
// 函数的调用方式
// 获取元素
let btn =document.querySelector('#btn');
console.log(btn);
// 初始化
let i=1;
// 对象.事件 =function(){}
btn.onclick=function(){
i++;
this.innerHTML =i;
console.log('ok');
}
}
预览：
（3）自调用
(function (){})()
// 函数的调用方式
// 自调用
(function(){
document.body.style.backgroundColor='blue';
})()
创建\调用函数注意问题
如果两个函数的命名相同，后面的将会覆盖前面的函数。
// 如果两个函数的命名相同，后面的将会覆盖前面的函数。
function msg(){
document.write('你好')
}
function msg(){
document.write('哈哈')
}
msg()
以基本语法声明的函数，会在页面载入的时候提前解析到内存中，以便调用。所以可以在函数的前面调用。 但是以字面量形式命名的函数，会在执行到他的时候，才进行赋值。所以只能在函数的后面调用。
sum(1,2) //写这里 是错误的
let sum = function(n,m){
document.write(n+m)
}
正确写法：
{
let sum = function(n,m){
document.write(n+m)
}
sum(1,2)
}
在不同的块中，因为浏览器解析的时候是分块解析的，所以前面的块不能调用后面块的函数，所以在不同的块之间调用函数的时候，应该先定义后调用。
正确写法：
1.2.3 函数参数
带有参数的函数
参数的作用：可以动态的改变函数体内对应的变量的值，使同一函数体得到不同的结果。
形参：在定义函数的时候，函数括号中定义的变量叫做形参。用来接受实参的。
实参：调用函数的时候，在括号中传入的变量或值叫做实参。用于传递给形参。
{
// 函数中的参数
// 可以动态的改变**函数体内**对应的变量的值，使同一函数体得到不同的结果。
function sum(a,b){
return a+b
}
console.log(sum(1,2));
console.log(sum(2,2));
console.log(sum(3,2));
}
预览：
参数的类型
可以是任何的数据类型。
例如：函数中的参数 可以是字符串类型的数据。
{
//可以是任何的数据类型。
// 获取元素
let box=document.getElementById('box')
function msg(text,url){
box.innerHTML=`${text}`;
}
msg('优酷','https://www.youku.com');
}
预览：
参数的个数
实参和形参数量相等，一 一对应。
实参小于形参不会报错，多出形参的值 会自动赋值为undefined。
// 实参小于形参不会报错，多出形参的值 会自动赋值为undefined。
function list(n,m,x,y){
console.log(y)
document.write(n+m+x+y)
}
list(1,2,3)
预览：
实参大于形参，不会报错，但如果要获得多出的实参的值，需要用arguments对象来获取。
function list(n,m,x,y){
console.log(x+y+m+n);
let r = arguments
console.log(r)
let j = arguments[4]
console.log(j)
}
list(1,2,3,4,5)
预览：
1.2.4 返回值
函数的返回值
return 语句–通过return 语句给函数一个返回值，停止并且跳出当前的函数。
{
// 自定义函数
function sum(a,b){
return a+b;
}
document.querySelector('#data').innerHTML=sum(100,2)
}
预览：
return语句的用法
–在return 语句后面的 函数体内所有内容 都不会输出。
预览：
–在函数体内可以有多个return语句，但是只会执行一个。(判断语句)
{
function msg(age){
if(age>18){
return '成年';
}else{
return '未成年';
}
}
document.getElementById('msg').innerHTML=msg(20);
}
预览：
return语句的返回值
– 返回值可以是任何的数据类型。
– 只能返回一个返回值。
– 如果函数没有返回值，那么这个函数的值就会自动的赋值为undefined。
预览：
返回值可以是任何的数据类型，例如：返回值可以是数组
{
function list(){
let arr =[100,200,300,400];
return arr
}
document.querySelector('#list').innerHTML =list()
}
预览：
{
function list(){
let arr=[100,200,300,400];
return arr
}
let lis=list();
for(let i=0;i console.log(lis[i]); document.querySelector('#list').innerHTML +=`
}
}
预览：