JavaScript / jQuery基础知识

js/jquery
   1.基本的概念:
       ①js语言是一种解析(浏览器解析)型的脚本语言
       ②js语言实现页面元素的操作,window对象的操作从而实现网页特效
       ③js是众多库的基础 jQuery/bootstrap/vue/node.js/react....
       ④js是严格区分大小写的语言
       ⑤js的命名习惯遵循驼峰命名法
       ⑥js中的注释单行注释: // 多行注释: /**/

   2.语言:
       ①嵌入到HTML页面中随浏览器解析执行
           A:直接把代码写在HTML标签中
           <button οnclick="javascript: js代码 ">点我吧</button>
           B:把js代码抽取出来
               单独写在一个 <script></script>标签中
               <script>
                   写js代码完成调用
               </script>
               注意顺序问题:标准写法是写在页面的最末尾位置
               如果写在head中注意适当要添加 window.onload
           C:把js代码单独写在一个文件中用script标签引入进来
               <script src="js路径"></script>

   3.js语法规则:
       通用语法:
           输出输入数据类型变量表达式运算符程序三大基本结构
           数组方法
       语言特性:
           面向对象 DOM操作 Window操作 ......

   4.通用语法:
       ①输出:
           alert(输出内容); //弹窗输出
           document.write(); //页面刷新输出会冲刷原有内容
           console.log(); //控制台输出程序员

       ②输入:
           来自于表单元素接收并提交
           prompt("提示信息","默认值"); 以string形式返回

       ③数据类型:
           几种类型:
               数值类型: number
               字符类型: string
               布尔类型: boolean
               数值/对象: object
               方法类型: function
               未定义类型: undefined
           变量:
               声明: var num; var str; 用var声明 var age=18; var s="s";
               用var声明代表的是弱数据类型必须结合后面的赋值确定数据类型

               typeof(变量); //返回该变量的数据类型

               声明未赋值变量就是 var stu; undefined类型
               区别和null 没有这个找到这个元素

               typeof(null)---->object
               typeof(undefined)--->undefined
           string:一堆方法

           var s="hello world"; //hello,test,tes,a,sd
           console.log(s.length);//获取长度
           console.log(s.charAt(0));// "h" 第一个字符
           console.log(s.substring(1)); //ello world
           console.log(s.substring(1,4));//"ell" 第2~4个字符
           console.log(s.slice(1,4));//同上
           console.log(s.slice(-3));//"rld" 最后三个字符
           console.log(s.indexOf("l"));//第一次出现的索引
           console.log(s.lastIndexOf("l"));//最后一次出现的索引
           console.log(s.indexOf("l",3));//在位置3及之后首次出现字符l的位置
           console.log(s.split(","));//变数组
           console.log(s.toUpperCase());//变大写
           console.log(s.toLowerCase());//变小写
           console.log(s.replace("h","H"));//替换
           console.log(s[0]);//es5中，字符串可以当做只读数组
           console.log(s[s.length-1]);

           类型转换:
               ①Xxxx------->数字
                   A: Xxxx*1.0
                   B: parseInt() parseFloat()


               ②Xxxx------->字符串
                   A: Xxxx+"";
                   B: .toString();
                   C: String("xxx");

       表达式运算符:
           = == === : 赋值判断内容相等判断内容+数据类型相等
           < <= >= > !=
           += -= /= *= %= a+=b; a=a+b;
           ++ -- var a=20;
                   var b=++a; //a=21 b=21
                   var c=b++; //c=21 b=22
                   //a= b= c=
           && || !
           ? var str=20>10?"对":"不对";

  ⑤程序的三大结构:
           顺序结构选择结构循环结构

           选择结构:
               if-else :非此即彼


               if() :区间判断
               else if(){}
               else if(){}
               else{}


               swicth(){ :单点等值判断
                   case:
                       break;
                   case:
                       break;
                   case:
                       break;
                   default:
                       break;
               }

           循环结构:
               while(){

               }

               do{

               }while();


               for(var i=0;i<100;i++){

               }
       ⑥js中的数组:
           声明:
               var array=[];                     //空数组
               var array1=[1,2,3,4,5]; //完成声明并赋值

               var array2=new Array(); //等同于[]
               var array3=new Array(10); //声明时指明数组长度
               var array4=new Array(1,2,3,4,5);//完成声明和赋值
               var array5=[ [1,[2,3,5]],[3,4],[5,6] ];//多维数组

           数组操作:
               ①访问和赋值都是通过下标来完成
               array[下标]

               ②获取数组的长度         length
               ③往数组末尾添加元素         push()
               ④删除数组末尾的元素并返回 pop()
               ⑤删除任意位置的元素
                   delete array[下标]; 保留位置删除元素内容
                   array.splice(下标,个数);不保留位置删除内容
               ⑥判断数组中是否包含某个元素
                   in array 5 in array1
               ⑦拼接数组的元素返回字符串 join()
               ⑧数组的字符排序 ANSCI码 sort()
               ⑨过滤器方法筛选
                           array.filter(function(item){
                               //item 代表数组中的每个数
                               if(item%2==1)
                                   return item;
                           });
               10遍历并按照规则返回数据方法 map 返回一个数组
                           array.map(function(item){
                               //item 代表数组中的每个数
                               return item;
                           });
               11直接遍历
                   A: for(var i=0;i<array3.length;i++){
                           console.log(array3[i]);
                       }

                   B: array3.forEach(function(x){
                           console.log(x);
                       });


       ⑦js中函数:
           定义:
               function 方法名称(参数){
                   //方法体
               }

               function add(num1,num2){
                   return num1+num;
               }
           调用:
               add(10,40);

           注意:
               写法：
               var f1=function(){}

               function add(){}
               var f2=add;

               f1();
               f2();
               这种写法就必须先声明再调用注意范围问题

JavaScript / jQuery基础知识

猜你喜欢