js基础

一.JavaScript由三部分组成:

      1)核心(ECMAScript)-------描述了JavaScript语言本身的相关内容

      2)文档对象模型(DOM) Document object model (整合js,css,html)

      3)浏览器对象模型(BOM) Broswer object model (整合js和浏览器)

二.JavaScript引入方式

      1)在<head>标签里的<script>标签里写js代码

            console.log(内容) #f12打开调试窗口,在console调试台就能看到内容

            alert(内容) #这个是浏览器窗口一打开这个文件就弹出的窗口

      2)引入额外的js文件

<script src='文件路径'></script>

三.JavaScript语言基础

      1.变量名使用_,数字,字母,$组成,不能以数字开头

      2. 声明变量 1)声明变量使用 'var 变量名;' 的格式来进行声明 var job='学生';

                       2)一个var声明多个变量,以逗号隔开                      var job='学生',hobby='银行';

                       3)声明一个变量不一定非要赋予初始值 var test;

      3.保留字列表

                                   abstract                                  boolean                                         byte                                        char                                        class                                const                                debugger                                double                                    enum                                export                               extends                                  final                                  float                                  goto                                  implements                                   import                               int                               interface                                 long                                  native                               package                                  private                                    protected                                public                                short                                 static                                super                                synchronized                                throws                                    transient                                 volatile

四.JavaScript数据类型

      1.数值类型(number)

            1)不区分浮点型和整数型,只有数字类型

            2)NaN,表示不是一个数字. 但是NaN本身的数据类型也是numbei.                                                                  

console.log(typeof (parseInt ("12a")));
console.log(typeof (parseInt("a12")));
console.log(parseFloat("11.11"));

                            

2.字符串类型(String)

var name="大白";

常用方法:     

.length 得到字符串的长度                                                        

.trim() 去除字符串两边的空格

.trimLeft() #方法名该大写的必须大写 去除字符串左边的空格

.trimRight() #方法名该大写的必须大写 去除字符串右边的空格

.charAt(n) #n类似于索引 从0开始,根据数值取相应内容,如果超出,返回(")空值

.concat(内容)             字符串的拼接, 字符串一般使用”+”拼接字符串

 

.IndexOf(指定内容,从哪个索引开始查找)          查找自定指定内容的索引

.substring(开始索引,结束索引)     根据索引查找子序列   不适合负数,一般不用 

.slice(开始索引,结束索引)                      切片

.toLowerCase()                                  将字符串内容全部变小写

.toUpperCase()                                  将字符串内容全部变大写

.split(以什么分割,分割想要获得参数个数)           将字符串内容进行分割

 

 

3.模板字符串   用 反引号``  括起来

                           1.普通              `这是普通的`

                           2.多行       `这是

多行`

                           3.字符串中嵌入变量  

                 // var a="单行",b="多行";
// var c=`hi ${a},hi ${b}`;

 

         4.布尔值(boolean)

                  1)分为:true和flase(首字母都是小写)

                  2)空字符串,0,null,undefined,NaN是false

        

         5.类型查询

                  typeof  数据

                  各种情况的typeof结果:

1)      变量未被赋值,默认为undefined --- undefined

2)      如果变量是true,flase  --- Boolean

3)      整数,小数 ,NaN    -----  number

4)      字符串            ----   string

5)      自定义对象, null,通过new实例化的对象,数组    ----   object

 

五.对象

                  带有属性和方法的特殊数据类型

1.      创建对象的两种方法

1)var obj={‘name’:’alex’};               自定义一个对象

2)var obj=new String(‘123’);       new就相当于实例化一个内置对象

2.      数组

1)作用:使用单独的变量名来存储一系列值,类似于python的列表

2)常用方法:

        

 

 使用sort()的时候注意,不使用参数的话,将按照字符编码的顺序排序.

 

3.      内置对象和方法

 

 

4.      自定义对象

JavaScript的对象(Object)本质上是键值对的集合(Hash结构),但是只能用字符串作为键。

 

 

六.运算符

      1.算数运算符

            +  -  *  /  %

            i++   i自加一          优先级低,当碰到逻辑时,先执行逻辑,再自加一

            ++i   i自加一          优先级高,碰到逻辑时,仍然先自加一,然后再执行逻辑

                  i--   --i    同上

         2.比较运算符

                  >   >=   <   <=  

                  ==  弱等于     1 == ‘1’   结果为true,如果数据类型不同,会自动变相同

                  ===  强等于    1===’1’  结果flase,比较类型也比较值

                  !=   弱不等    1 != ‘1’   结果false

                  !==  强不等    1 !== ‘1’   结果true

         3.逻辑运算符

                  &&  与(and)

                  ||   或(or)

                  !     非(取反)

 

4.赋值运算符

=  +=  -=  *=  /= 

 

 

七.流程控制

         1.if-else

var a=1;
if (a>5){
    console.log('yes');
}
else {
    console.log('no');
}

 

         2.if-else if-else多条件

var a=10;
if (a>5){
    console.log('我大');
}
else if (a=5){
    console.log('我中');
}
else{
    console.log('我小');
}

        

         3.swith切换

var day=new Date().getDay();
switch (day){
    case 0:console.log('sunday');
        break;
    case 1:console.log('monday');
        break;
    default:console.log('我不喜欢');
}
 
day这个位置的参数必须是一个值或者一个能得到值得式子
然后该值与switch内部case后面的值进行比较,相同就执行其后语句,然后break,不同就继续往下执行
 
4.for
          for  (var i=0;i<10;i++){
                       console.log(i);
                       }
 
           循环数组:
                  方式一:
var a=[1,2,3,4,5,44,22,25];
for (var i in  a){
    console.log(a[i]);
}

                                            方式二:

                   for (var i=0;i<a.length;i++){
                    console.log(i,a[i])
                                }
 

                          循环自定义对象:

var a={'name':'大白','age':13,'job':'sytudent'};
for (var i in a){
    console.log(i,a[i]);
}

                                            #循环自定义对象时,打印对应键的值,只能以  对象[键]  的方式

                       不能以  对象.键  的方式

 

5.      while

var a=0;
while (a<10){
    console.log(a);
    a++;
}
 

6.      三元运算

var a=3;
var b=2;
var c= a>b ? a:b;
         #如果a>b这个条件成立,就把冒号前面的值赋给c,否则把冒号后面的值赋给c.
console.log(c);
八.函数

1.函数定义

         1)普通函数定义

function f1(){
       console.log('普通函数')
  }
  f1()
 

    2)带参数的函数定义

     function f2(a,b) {
    console.log(arguments);       #内置的arguments对象
    console.log(arguments.length);
                                           console.log(a-b);
             }
     f2(3,4);

 

3)带返回值的函数

               function sum(a,b){
                return a+b;
                 }
                 console.log(sum(3,4));
 
        4)匿名函数方式
               var sum=function(a,b){
                       return a+b;
               }

                  console.log(sum(1,2));

5)立即执行函数,当页面打开的时候,函数就直接执行,不需要被调用才执行

ret=(function (a,b){
    return a+b;
})(1,2);
console.log(ret);

6)箭头函数

     var f= => v;
console.log(f(5));
    
    等同于:
    Var f=function(v){return v;}

 

7)函数的全局变量和局部变量

                  1.局部变量:在函数内部声明的变量,只能在函数内被调用,函数运行完之后会被删除

                   全局变量:在函数外部声明的变量,所有脚本和函数都能调用

 

                  2.变量生存周期:

                                   从它们被声明的时间开始

                                   局部变量在函数执行完之后被删除

                                   全局变量在页面关闭后被删除

 

8)函数的作用域

                  首先在函数内部查找,找不到则在外层函数查找,逐步往外.

 

 

9)面向对象,在ES5中没有类的概念,只有个构造函数,命名的首要字母要大写,

         实例化的时候使用new关键字进行实例化

function People(name){
   this.name=name;
}
console.log(People.name);
People.prototype.func1=function(){
    console.log(this.name,'爱编程');
}
var p1 new People('大白');
p1.func1();

 

九.Date对象

         1.创建Date对象

                  1)var  d1= new Date();         获取当前时间

                    Console.log(d1.toLocaleString());    当前时间日期的字符串表示

                  2)参数为日期字符串

                          var d2=new Date(“2013/10/1  11:12”);

                       console.log(d2.toLocaleString());

                          另一种写法:var d2=new Date(“13/10/1  11:12”)

                  3)参数为毫秒数

                          var d3= new Date(5000);

                          console.log(d3.toLocaleString());

                          console.log(d3.toUTCString);

                  4)参数为年月日时分秒毫秒

                          var d4=new Date(2013,10,1,12,12,12,400);

                          console.log(d4.toLocaleString());       毫秒不会直接显示

 

 

         2.Date对象的方法

                  1)getDate()       获取日

                  2)getDay()        获取星期,周日为0,数字(0-6)

                  3)getMoth()       获取月份(0-11)

                  4)getFullYear()       获取完整年份

                  5)getHours()         获取小时

                  6)getMinutes()        获取分钟

                  7)getSeconds()        获取秒

                  8)getMilliseconds()      获取毫秒

                  9)getTime()             返回时间戳

 

十.JSON对象

          将字符串转化为对象:  JSON.parse(字符串)

          将对象转化成字符串:  JSON.stringify(对象)

var str1='{"name":"大白","age":11}';
var obj=JSON.parse(str1);
console.log(obj);
console.log(str1);

var obj1={"name":"大白","age":11};
var str2=JSON.stringify(obj1);
console.log(str2);
console.log(obj1);
 
十一.Math对象(类似于Python的内置函数)
        Math.abs(x) 返回数的绝对值。 
        exp(x) 返回 e 的指数。 
        floor(x) 小数部分进行直接舍去。 
        log(x) 返回数的自然对数(底为e)。
        max(x,y) 返回 x 和 y 中的最高值。 
        min(x,y) 返回 x 和 y 中的最低值。 
        pow(x,y) 返回 x 的 y 次幂。 
        random() 返回 0 ~ 1 之间的随机数。 
        round(x) 把数四舍五入为最接近的整数。 
        sin(x) 返回数的正弦。 
        sqrt(x) 返回数的平方根。 
        tan(x) 返回角的正切。
十二.RegExp正则对象

1)      创建RegExp对象

方式一:var reg1= new RegExp(“正则表达式”);

方式二:var reg2=/正则表达式/;

2)      test方法,测试一个字符串是否符合对应的正则规则,结果返回true或false

var s1=’11daf’;

reg1.test(s1);

3)      String对象与正则结合的方法

var s2=’hello world’;

1.      S2.match(/o/g);

查找字符串中的’o’,   g表示匹配字符串中的所有’o’

2.      s2.search(/h/g);

查找想要的内容的索引位置,只会返回第一个,加不加g无所谓

3.      s2.split(/o/g);

一.JavaScript由三部分组成:

      1)核心(ECMAScript)-------描述了JavaScript语言本身的相关内容

      2)文档对象模型(DOM) Document object model (整合js,css,html)

      3)浏览器对象模型(BOM) Broswer object model (整合js和浏览器)

二.JavaScript引入方式

      1)在<head>标签里的<script>标签里写js代码

            console.log(内容) #f12打开调试窗口,在console调试台就能看到内容

            alert(内容) #这个是浏览器窗口一打开这个文件就弹出的窗口

      2)引入额外的js文件

<script src='文件路径'></script>

三.JavaScript语言基础

      1.变量名使用_,数字,字母,$组成,不能以数字开头

      2. 声明变量 1)声明变量使用 'var 变量名;' 的格式来进行声明 var job='学生';

                       2)一个var声明多个变量,以逗号隔开                      var job='学生',hobby='银行';

                       3)声明一个变量不一定非要赋予初始值 var test;

      3.保留字列表

                                   abstract                                  boolean                                         byte                                        char                                        class                                const                                debugger                                double                                    enum                                export                               extends                                  final                                  float                                  goto                                  implements                                   import                               int                               interface                                 long                                  native                               package                                  private                                    protected                                public                                short                                 static                                super                                synchronized                                throws                                    transient                                 volatile

四.JavaScript数据类型

      1.数值类型(number)

            1)不区分浮点型和整数型,只有数字类型

            2)NaN,表示不是一个数字. 但是NaN本身的数据类型也是numbei.                                                                  

console.log(typeof (parseInt ("12a")));
console.log(typeof (parseInt("a12")));
console.log(parseFloat("11.11"));

                            

2.字符串类型(String)

var name="大白";

常用方法:     

.length 得到字符串的长度                                                        

.trim() 去除字符串两边的空格

.trimLeft() #方法名该大写的必须大写 去除字符串左边的空格

.trimRight() #方法名该大写的必须大写 去除字符串右边的空格

.charAt(n) #n类似于索引 从0开始,根据数值取相应内容,如果超出,返回(")空值

.concat(内容)             字符串的拼接, 字符串一般使用”+”拼接字符串

 

.IndexOf(指定内容,从哪个索引开始查找)          查找自定指定内容的索引

.substring(开始索引,结束索引)     根据索引查找子序列   不适合负数,一般不用 

.slice(开始索引,结束索引)                      切片

.toLowerCase()                                  将字符串内容全部变小写

.toUpperCase()                                  将字符串内容全部变大写

.split(以什么分割,分割想要获得参数个数)           将字符串内容进行分割

 

 

3.模板字符串   用 反引号``  括起来

                           1.普通              `这是普通的`

                           2.多行       `这是

多行`

                           3.字符串中嵌入变量  

                 // var a="单行",b="多行";
// var c=`hi ${a},hi ${b}`;

 

         4.布尔值(boolean)

                  1)分为:true和flase(首字母都是小写)

                  2)空字符串,0,null,undefined,NaN是false

        

         5.类型查询

                  typeof  数据

                  各种情况的typeof结果:

1)      变量未被赋值,默认为undefined --- undefined

2)      如果变量是true,flase  --- Boolean

3)      整数,小数 ,NaN    -----  number

4)      字符串            ----   string

5)      自定义对象, null,通过new实例化的对象,数组    ----   object

 

五.对象

                  带有属性和方法的特殊数据类型

1.      创建对象的两种方法

1)var obj={‘name’:’alex’};               自定义一个对象

2)var obj=new String(‘123’);       new就相当于实例化一个内置对象

2.      数组

1)作用:使用单独的变量名来存储一系列值,类似于python的列表

2)常用方法:

        

 使用sort()的时候注意,不使用参数的话,将按照字符编码的顺序排序.

 

3.      内置对象和方法

 

 

4.      自定义对象

JavaScript的对象(Object)本质上是键值对的集合(Hash结构),但是只能用字符串作为键。

 

 

六.运算符

      1.算数运算符

            +  -  *  /  %

            i++   i自加一          优先级低,当碰到逻辑时,先执行逻辑,再自加一

            ++i   i自加一          优先级高,碰到逻辑时,仍然先自加一,然后再执行逻辑

                  i--   --i    同上

         2.比较运算符

                  >   >=   <   <=  

                  ==  弱等于     1 == ‘1’   结果为true,如果数据类型不同,会自动变相同

                  ===  强等于    1===’1’  结果flase,比较类型也比较值

                  !=   弱不等    1 != ‘1’   结果false

                  !==  强不等    1 !== ‘1’   结果true

         3.逻辑运算符

                  &&  与(and)

                  ||   或(or)

                  !     非(取反)

 

4.赋值运算符

=  +=  -=  *=  /= 

 

 

七.流程控制

         1.if-else

var a=1;
if (a>5){
    console.log('yes');
}
else {
    console.log('no');
}

 

         2.if-else if-else多条件

var a=10;
if (a>5){
    console.log('我大');
}
else if (a=5){
    console.log('我中');
}
else{
    console.log('我小');
}

        

         3.swith切换

var day=new Date().getDay();
switch (day){
    case 0:console.log('sunday');
        break;
    case 1:console.log('monday');
        break;
    default:console.log('我不喜欢');
}
 
day这个位置的参数必须是一个值或者一个能得到值得式子
然后该值与switch内部case后面的值进行比较,相同就执行其后语句,然后break,不同就继续往下执行
 
  4.for
          for  (var i=0;i<10;i++){
                       console.log(i);
                       }
 
           循环数组:
                  方式一:
              var a=[1,2,3,4,5,44,22,25];
              for (var i in  a){
                console.log(a[i]);
                }

                                方式二:

                   for (var i=0;i<a.length;i++){
                    console.log(i,a[i])
                                }
 

                          循环自定义对象:

          var a={'name':'大白','age':13,'job':'sytudent'};
            for (var i in a){
              console.log(i,a[i]);
            }

                                            #循环自定义对象时,打印对应键的值,只能以  对象[键]  的方式

                       不能以  对象.键  的方式

 

  5.      while

    var a=0;
    while (a<10){
      console.log(a);
      a++;
    }
 

  6.      三元运算

  var a=3;
  var b=2;
  var c= a>b ? a:b;
         #如果a>b这个条件成立,就把冒号前面的值赋给c,否则把冒号后面的值赋给c.
  console.log(c);
八.函数

  1.函数定义

           1)普通函数定义

      function f1(){
         console.log('普通函数')
        }
       f1()
 

      2)带参数的函数定义

       function f2(a,b) {
        console.log(arguments);       #内置的arguments对象
        console.log(arguments.length);
               console.log(a-b);
             }
       f2(3,4);

 

  3)带返回值的函数

               function sum(a,b){
                return a+b;
                 }
                 console.log(sum(3,4));
 
      4)匿名函数方式
               var sum=function(a,b){
                       return a+b;
               }

                  console.log(sum(1,2));

5)立即执行函数,当页面打开的时候,函数就直接执行,不需要被调用才执行

ret=(function (a,b){
    return a+b;
})(1,2);
console.log(ret);

6)箭头函数

     var f = => v;
  console.log(f(5));
    等同于:
    Var f=function(v){return v;}

 

7)函数的全局变量和局部变量

                  1.局部变量:在函数内部声明的变量,只能在函数内被调用,函数运行完之后会被删除

                   全局变量:在函数外部声明的变量,所有脚本和函数都能调用

 

                  2.变量生存周期:

                                   从它们被声明的时间开始

                                   局部变量在函数执行完之后被删除

                                   全局变量在页面关闭后被删除

 

8)函数的作用域

                  首先在函数内部查找,找不到则在外层函数查找,逐步往外.

 

 

9)面向对象,在ES5中没有类的概念,只有个构造函数,命名的首要字母要大写,

         实例化的时候使用new关键字进行实例化

      function People(name){
           this.name=name;
        }
       console.log(People.name);
      People.prototype.func1=function(){
            console.log(this.name,'爱编程');
        }
      var p1 new People('大白');
      p1.func1();

 

九.Date对象

         1.创建Date对象

                  1)var  d1= new Date();         获取当前时间

                    Console.log(d1.toLocaleString());    当前时间日期的字符串表示

                  2)参数为日期字符串

                          var d2=new Date(“2013/10/1  11:12”);

                       console.log(d2.toLocaleString());

                          另一种写法:var d2=new Date(“13/10/1  11:12”)

                  3)参数为毫秒数

                          var d3= new Date(5000);

                          console.log(d3.toLocaleString());

                          console.log(d3.toUTCString);

                  4)参数为年月日时分秒毫秒

                          var d4=new Date(2013,10,1,12,12,12,400);

                          console.log(d4.toLocaleString());       毫秒不会直接显示

 

 

         2.Date对象的方法

                  1)getDate()       获取日

                  2)getDay()        获取星期,周日为0,数字(0-6)

                  3)getMoth()       获取月份(0-11)

                  4)getFullYear()       获取完整年份

                  5)getHours()         获取小时

                  6)getMinutes()        获取分钟

                  7)getSeconds()        获取秒

                  8)getMilliseconds()      获取毫秒

                  9)getTime()             返回时间戳

 

十.JSON对象

          将字符串转化为对象:  JSON.parse(字符串)

          将对象转化成字符串:  JSON.stringify(对象)

var str1='{"name":"大白","age":11}';
var obj=JSON.parse(str1);
console.log(obj);
console.log(str1);

var obj1={"name":"大白","age":11};
var str2=JSON.stringify(obj1);
console.log(str2);
console.log(obj1);
 
十一.Math对象(类似于Python的内置函数)
        Math.abs(x) 返回数的绝对值。 
        exp(x) 返回 e 的指数。 
        floor(x) 小数部分进行直接舍去。 
        log(x) 返回数的自然对数(底为e)。
        max(x,y) 返回 x 和 y 中的最高值。 
        min(x,y) 返回 x 和 y 中的最低值。 
        pow(x,y) 返回 x 的 y 次幂。 
        random() 返回 0 ~ 1 之间的随机数。 
        round(x) 把数四舍五入为最接近的整数。 
        sin(x) 返回数的正弦。 
        sqrt(x) 返回数的平方根。 
        tan(x) 返回角的正切。
十二.RegExp正则对象

1)      创建RegExp对象

方式一:var reg1= new RegExp(“正则表达式”);

方式二:var reg2=/正则表达式/;

2)      test方法,测试一个字符串是否符合对应的正则规则,结果返回true或false

var s1=’11daf’;

reg1.test(s1);

3)      String对象与正则结合的方法

var s2=’hello world’;

1.      S2.match(/o/g);

查找字符串中的’o’,   g表示匹配字符串中的所有’o’

2.      s2.search(/h/g);

查找想要的内容的索引位置,只会返回第一个,加不加g无所谓

3.      s2.split(/o/g);

按照’o’对字符串进行分割,得到一个想要的新值,原字符串不变

4.      s2.replace(/o/ ,”w”);

将o替换成w,

加上g就是把所有o替换成w.

加上gi 只要是o不管大小写都替换成w

按照’o’对字符串进行分割,得到一个想要的新值,原字符串不变

4.      s2.replace(/o/ ,”w”);

将o替换成w,

加上g就是把所有o替换成w.

加上gi 只要是o不管大小写都替换成w

 

posted @ 2019-05-07 22:41  socoolonly1  阅读(65)  评论(0)    收藏  举报