js 作用域 预解析 对象 内置对象

一、js作用域
//注意 如果在函数内部 没有声明直接赋值的变量也是全局变量
///注意 函数的形参也可以看成局部变量

//js作用于（es6）之前：全局作用域 局部作用域
//3.全局作用域： 整个script标签 或者一个单独的js文件
var num =10;
console.log(num);//10

//4.局部作用域：在函数内部的就是局部作用域
function fn(){
    //局部作用域
    var num=20;
    console.log(num);
    
}
fn();//20
//注意 如果在函数内部 没有声明直接赋值的变量也是全局变量
///注意  函数的形参也可以看成局部变量
3.从执行效率来看全局变量和局部变量
//（1）全局变量只有浏览器关闭的时候才会被销毁
//（2）函数代码块运行结束后就会被销毁

作用域链：就近原则

//作用域链：就近原则
var num =10;
function fn()
{
   var num=20;
   
   function fun()
   {
       console.log(num);  
   }
   fun();
}
fn();//20

二、js预解析

fn();//11

function fn()
{
    console.log(11);
    
}
fn();//11

fun();//error
var fun=functin()
{
    console.log(22);
    
}
fun();//22

1.我们js引擎运行js 分为两步： 预解析 代码执行
1）预解析 js引擎会把js里面所有的var 还有function 提升到当前作用 域的最前面
2）代码执行 按照代码书写的顺序从上往下执行
2.预解析分为 变量预解析 （变量提升）和函数预解析（函数提升）
（1）变量提升 就是吧所有变量声明提升到当前作用域最前面 不提升赋值操作
（2）函数提升：就是把所有函数声明提升到作用域前面 不调用函数

console.log(num);//undefined
var num=10;

//预解析
var num;
console.log(num);
num=10;

fun();
var fun=function(){
    console.log(22);
    
}
//预解析
var fun;
fun();
fun=function()
{
    console.log(22);
    
}

fn();//11

function fn()
{
    console.log(11);
    
}

//预解析
function fn()
{
    console.log(11);
    
}
fn();//11

var num =10;
fun();
function fun()
{
    console.log(num);
    var num=20;
    console.log(num);
}
//相当于执行
var num;
function fun()
{
    var num;
    console.log(num);//undefined
    num=20;
    console.log(num);//20 
}
num=10;
fun();

f1();
console.log(c);
console.log(b);
console.log(a);
function f1()
{
    var a=b=c=9;
    //var a=9; b=9;c=9;
    console.log(a);
    console.log(b);
    console.log(c);
    
}

//相当于
function f1()
{
    var a;
    a=9;
    b=9;
    c=9;
    //var a=9; b=9;c=9;
    console.log(a);//9
    console.log(b);//9
    console.log(c);//9

}
f1();
console.log(c);//9
console.log(b);//9
console.log(a);//error

三、js对象

1.利用字面量创建对象{}

//1.利用对象字面量创建对象
var obj={};//创建了一个空的对象
var obj={
    uname:'张三丰',
    age:18,
    sex:'男',
    syaHi:function(){
        console.log('hi');
        
    }
}
//2.使用对象
//（1）调用属性
console.log(obj.uname);
//(2)条用属性还有一种方法 对象名['属性名']
console.log(obj['age']);
//(3)条用对象方法 
obj.syaHi();

2、利用new object 创建对象

//利用new object 创建对象
var obj=new Object();
obj.uname='ss';
obj.age=18;
obj.sex='man';
obj.sayHi=function(){
    console.log('hi~');
    
}

3、利用构造函数创建对象

//前面两种创建方式一次只能创建一个的对象
//因此我们可以利用函数的方法 重复这些相同的代码 我们吧这个函数称为 构造函数
//又因为这个函数不一样 里面封装的不是普通代码 二十 对象
//构造函数 就是把我们对象里面一些相同的属性和方法抽象出来封装到函数里面
/* function  构造函数名(){
    this.属性=值;
    this.方法=function(){}
}
       new 构造函数名(); */
function Star(uname,age,sex){
     this.name=uname;
     this.age=age;
     this.sex=sex;
     this.sing=function(sang){
         console.log(sang);
         
     }
}
var ldh=new Star('刘德华',18,'男');//返回的是一个对象
console.log(typeof ldh);//object
console.log(ldh.name);
console.log(ldh['sex']);
ldh.sing('冰雨');
var zxy=new Star('张学友',19,'男');//返回的是一个对象
//1.构造函数的名字首字母大写
//2.构造函数不需要return就可以返回结果

4、遍历对象属性

var obj= {
    name:'44',
    age:18,
    sex:'man',
    fn:function(){}
}
for(var k in obj)
{
    console.log(k);//输出的是 属性名
    console.log(obj[k]);//输出的是属性值

    
}

四、js内部对象

对象分3中：自定义对象、内置对象、浏览器对象
第三个对象是js独有的。

内置对象就是值js语言自带的一些对象：
Math、Date、Array、String

1、math对象

//math对象不是构造函数 所以不需要new 直接调用
console.log(Math.PI);
console.log(Math.max(1,999,3));//999

var myMath={
    PI:3.141592653,
    max:function(){
         var max=arguments[0];
         for(var i=0;i<arguments.length;i++)
         {
             if(arguments[i]>max)
             {
                 max=arguments[i];
             }
         }
         return max;
    }
}
console.log(myMath.PI);//3.1141592653
console.log(myMath.max(4,5,6,98));//98
//绝对值
console.log(Math.abs(-1));//1
console.log(Math.abs('-1'));//1 隐式转换 会把字符型 -1 转换为数字型

random()

//random（）返回一个随机小数0-1，包括0不包括1 0<=x<1
//2.这个方法里面不跟参数
//3.代码验证
console.log(Math.random());
//1-10内的随机整数 min<=x<=max
function getRandom(min,max)
{
   return  Math.floor(Math.random()*(max-min+1))+min;
}
console.log(getRandom(1,10));


//随机点名
var arr=['张三','ss','里斯','xxx'];
console.log(arr[getRandom(0,arr.length-1)]);

2、Date（）对象

//Date()日期对象是一个构造函数 必须使用new 来调用创建我们的日期对象

var date =new Date();
console.log(date);
//参数常用的写法  数字型 2019，10，01 或者‘2019-10-1 8：8：8’
var date1=new Date(2019,10,1);
console.log(date1);
console.log(date.getFullYear());
console.log(date.getMonth()+1);//返回的月份小1月 记得月份+1
console.log(date.getDay());//周一返回的是1  周六是6 周日返回是0
var year=date.getFullYear();
var month=date.getMonth()+1;
var dates=date.getDate();
var arr=['星期日','星期一','星期二','星期三','星期四','星期五','星期六']
var day =date.getDay();
console.log('今天是'+year+'年'+month+'月'+dates+'日'+arr[day]);

3、数组对象

var arr=[1, 2,3];
var arr3=new Array();//创建空数组
var arr1=new Array(2);//表示数组的长度为2，2个空元素
var arr2=new Array(2,3);//表示数组的两个元素2 ，3

判断是否为数组元素

//instanceof 运算符 可以用来检测是否为数组
var arr=[];
var obj={};
console.log(arr instanceof Array);//true
console.log(obj instanceof Array);//false
//Array.isArray(参数) ;H5 新增的方法 ie9以上版本支持
console.log(Array.isArray(arr));
console.log(Array.isArray(obj));

添加删除数组元素

//1.push()在数组末尾添加
var arr=[1,2,3];
arr.push(4,'pink');//返回的值时新数组的长度
console.log(arr);

//2.unshift()在开头添加元素
arr.unshift('red');//返回的值时新数组的长度
console.log(arr);

//3、pop()删除数组的最后一个元素

arr.pop();
console.log(arr);//返回的是删除的哪一个元素

//4、shift()删除的是数组的第一个元素
arr.shift();//返回的是删除的哪一个元素
console.log(arr);

//数组排序

//数组排序
//1.反转数组
var  arr=['pink','red','blue'];
arr.reverse();
console.log(arr);

//2.数组排序（冒泡）
var arr1 =[3,4,7,1];
arr1.sort(function(a,b)
{
    return a-b;//升序排序
   // return b-a;//降序排序
});
console.log(arr1);

//没有function，两位数没法排序

返回数组元素索引号的方法

//返回数组元素索引号的方法
var arr=['red','blue','pink'];
//从前向后查找
console.log(arr.indexOf('blue'));
//返回一个数组中第一个这个元素的索引号，
//如果数组中没有这个元素则返回-1
console.log(arr.lastIndexOf('blue'));//从后向前查找

数组转化为字符串

//数组转化为字符串
//1.tostring()
var arr=[1,2,3];
console.log(arr.toString());1,2,3

//2.join（分隔符）
var arr1=['green','blue','pink'];
console.log(arr1.join());//green,blue,pink
console.log(arr1.join('-'));//green-blue-pink

4.字符串对象
基本包装类型

//基本包装类型:就是吧简单数据类型包装成为了复杂数据类型，就可以使用里面的属性和方法
var str='andy';
console.log(str.length);

//相当于
//（1）
var temp=new String('andy');
//(2)把临时变量的值 给str
str=temp;
//(3)销毁这个临时变量
temp=null;

字符串的不可变

//字符串的不可变//字符串andy的值依旧占用内存，red新开辟了一片内存，所以要避免字符串的大量重新赋值
var str='andy';
console.log(str);
str='red';

var str='改革春天春天来了';
//str.indexOf('春',3);
console.log(str.indexOf('春',3));//4  起始位置

根据位置返回字符

//根据位置返回字符
//1.charAt(index) 根据位置返回字符
var  str='andy';
console.log(str.chatAt(3));
//遍历所有的字符
for(var i;i<str.length;i++)
{
    console.log(str.chatAt(i));
    
}

//2.charCodeAt(index) 返回相应索引号的字符ASCLL 值目的 ；判断用户按下哪个键
console.log(str.charCodeAt(0));//95
//3、 H5新增的
console.log(str[0]);

var o={
    age:18
}
if(o['sex'])
{
    console.log('里面又改属性');
    
}
else{
    console.log('里面没有该属性');
    
}

字符串的操作

//字符串的操作
//1.concat('字符串1'，'字符串2')
//拼接 或+
var str='andy';
console.log(str.concat('red'));
//2.substr(str,length)
var str1='ssssddddd';
console.log(str1.substr(2,3));
//3.替换字符 replace（'被替换的字符','替换为的字符'）
var str= 'andy';
console.log(str.replace('a','b'));
//4.字符串转换为数组split('分隔符')
//join 吧数组转换为字符串
var str2='red ,blue,blue';
console.log(str2.split(','));

//简单数据类型放到栈里面，直接开辟一个空间，存放的是值
//复杂数据类型 首先在栈里面存放地址（16进制），然后地址指向堆里面的数据