黑马程序员技术交流社区

标题: 【成都校区*自研】JavaScript快速入门 [打印本页]

---

作者: 钟佩桓    时间: 2018-4-26 16:58
标题: 【成都校区*自研】JavaScript快速入门

大家好，本内容是教大家怎么快速的入门javascript的，关于js的学习其实很简单，大家只需要把下面几点弄清楚，js的入门你也成功了，接下来咱们就一起来看一看吧。

• js是什么？
  
  • 全名叫做javascript，是一个脚本语言（脚本语言是指：一系列的指令，最早出现在演戏的剧本中，台词就称为脚本，只要演员一看到脚本就知道表演什么动作，而在我们计算机应用中，脚本就是指指令，js是嵌套在html代码中的，html是用浏览器打开解析的，js也是可以被浏览器解析的，浏览器能通过解析js的一系列指令就可以做出一系列的动作，所以称为脚本语言），一个独立的编程语言。
    
  
  

---

• js的作用是什么？
  
  • 没有js的页面是死的，不能和用户进行交互，但是如果将一个页面嵌入js代码，这个页面就活了，可以和用户进行交互。
    
  
  

---

• js的引入方式是什么？
  
  • 方式一：
  • [JavaScript] 纯文本查看 复制代码

    <script type="text/javascript">
    
    </script>

  • 方式二：
  • [JavaScript] 纯文本查看 复制代码

    <script type="text/javascript" src="../js/check.js"></script>

    
    
  
  js的基本语法有哪些？
  
  • 变量
    js中定义一个变量用var
    例：var x = 5;
    java中定义变量用数据类型
    比如：int x = 5;
    在java中,一个int类型占4个字节,所以如果我们写int x = 5;在内存中会有一个可以存储4个字节的内存空间，但在js中就不一样了，var不是一个什么类型,它可以存任意类型的数据。
    例：var x = 5; alert(x);
    例：x = "abc"; alert(x); //x='abc'，在js中不管是单引号还是双引号都是字符串,没有字符的概念。
    例：x = new Object(); alert(x);
    例：x = true; alert(x)
    
    
  
  语句
  js的语句和java的语句几乎是一样的。
  这里特别需要注意的就是判断条件的值是true还是false问题。
  例：

        

[JavaScript] 纯文本查看 复制代码

                var x = 5;

                if(x % 2 == 0) {

                        alert(true);

                } else {

                        alert(false);

                }

                }

[JavaScript] 纯文本查看 复制代码

                var x = 5;

                if(x) {

                        alert(true);

                } else {

                        alert(false);

                }

• 打印出来的结果是偶数,因为数字只有0会当做false,其他的数都是true。
• 例：
  

[JavaScript] 纯文本查看 复制代码

                var x = "abc";

                if(x) {

                        alert(true);

                } else {

                        alert(false);

                }

• 打印出来的结果是true,字符串只有空串是false,其他的是true。
  
  例：
  [JavaScript] 纯文本查看 复制代码

                  var x = new Object();
  
                  if(x) {
  
                          alert(true);
  
                  } else {
  
                          alert(false);
  
                  }

  
  
• 打印出来的结果是true,对象只有null是false,其他的是true。
  
  例：
  [JavaScript] 纯文本查看 复制代码

                  var x;
  
                  if(x) {
  
                          alert(true);
  
                  } else {
  
                          alert(false);
  
                  }

• 打印出来的是false,所以只有0,"",null,undefined是false,其他所有的都是true。
• 函数
  在java中定义函数是：  public void xxx() {System.out.println("xxx");}
  在js中定义函数的格式和java不太一样
  例：
  [JavaScript] 纯文本查看 复制代码

                  <pre>
  
                  function xxx() {
  
                          alert("xxx");
  
                  }
  
                  </pre> 

  例：
  [AppleScript] 纯文本查看 复制代码

  function getArea(a, b) {
  
      alert("矩形的面试为:" + a * b);
  
  }
  
  getArea(5, 10);

  [JavaScript] 纯文本查看 复制代码

                  function getArea(a, b) {
  
                          alert("矩形的面试为:" + a * b);
  
                  }
  
                  getArea(5, 10);

  匿名函数,一般用在事件处理的。
  例：
  [JavaScript] 纯文本查看 复制代码

                  window.onload = function() {//页面加载完毕时执行匿名函数
  
                          alert(弹出一个对话框);
  
                  }

  
  
  • 数组
    Java中数组是一个容器,但是长度不可以变,类型必须一致。
    js中数组可以存任意类型元素,长度可变,类似java中的list集合。
    在js中定义数组容器：var arr = [1,2,3];
    
    

  ---

  • js的事件处理方式有哪些？
    
    • 方式一:
      
      • 写html的事件属性
      • [JavaScript] 纯文本查看 复制代码

        <input type="button" value="点我啊!"text/javascript">
        
                function xxx() {
        
                        alert("点你怎么啦!");
        
                }
        
        </script>

        
        
  • 方式二
    
    • 通过js内置对象document获取元素对象
    • [JavaScript] 纯文本查看 复制代码

      <input type="button" value="点我啊!" id="bt">
      
      <script type="text/javascript">
      
              window.onload = function() {
      
                      var bt = document.getElementById("bt");
      
                      bt.onclick = function() {
      
                              alert("点你怎么啦!");
      
                      }
      
              }
      
      </script>

      
      
    
    
    

    ---

    js的最简单的基本入门就到这里，大家是不是感觉学习js其实并不难呢，那就抽出时间实际动手操作操作吧，咱们下次见~

    
    
    

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2