html--前端JavaScript基本内容

Posted 梦想一步登天

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html--前端JavaScript基本内容相关的知识,希望对你有一定的参考价值。

一、javascript 变量

  在 JavaScript 中创建变量通常称为"声明"变量。
  使用 var 关键词来声明变量。
注意:
1、变量必须以字母开头
2、变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做)
3、变量名称对大小写敏感(y 和 Y 是不同的变量)
4、JavaScript 语句和 JavaScript 变量都对大小写敏感。

示例:

<script type="text/javascript">

    // 全局变量
    name = seven;

    // 定义函数
    function func(){
        // 局部变量
        var age = 18;

        // 全局变量
        gender = ""
    }
</script>            

 

二、JavaScript 数据类型
JavaScript 中的数据类型分为原始类型和对象类型:
1、原始类型:
  数字(Number)
  JavaScript 只有一种数字类型。数字可以带小数点,也可以不带:
    var x1=34.00; // 使用小数点来写
    var x2=34; // 不使用小数点来写

  Number对象相关属性
    Number.MAX_VALUE 最大数值
    Number.MIN_VALUE 最小数值
    Number.NaN 特殊的非数字值
    Number.NEGATIVE_INFINITY 负无穷大
    Number.POSITIVE_INFINITY 正无穷大
    Number.toExponential( ) 用指数计数法格式化数字
    Number.toFixed( ) 采用定点计数法格式化数字
    Number.toLocaleString( ) 把数字转换成本地格式的字符串
    Number.toPrecision( ) 格式化数字的有效位
    Number.toString( ) 将—个数字转换成字符串
    Number.valueOf( ) 返回原始数值

  字符串(String)
  字符串可以是引号中的任意文本。您可以使用单引号或双引号:
    var carname="Volvo XC60"; //双引号
    var carname=‘Volvo XC60‘; //单引号

  String对象相关属性
    String.charAt( ) 返回字符串中的第n个字符
    String.charCodeAt( ) 返回字符串中的第n个字符的代码
    String.concat( ) 连接字符串
    String.fromCharCode( ) 从字符编码创建—个字符串
    String.indexOf( ) 检索字符串
    String.lastIndexOf( ) 从后向前检索一个字符串
    String.length 字符串的长度
    String.localeCompare( ) 用本地特定的顺序来比较两个字符串
    String.match( ) 找到一个或多个正则表达式的匹配
    String.replace( ) 替换一个与正则表达式匹配的子串
    String.search( ) 检索与正则表达式相匹配的子串
    String.slice( ) 抽取一个子串
    String.split( ) 将字符串分割成字符串数组
    String.substr( ) 抽取一个子串
    String.substring( ) 返回字符串的一个子串
    String.toLocaleLowerCase( ) 把字符串转换小写
    String.toLocaleUpperCase( ) 将字符串转换成大写
    String.toLowerCase( ) 将字符串转换成小写
    String.toString( ) 返回字符串
    String.toUpperCase( ) 将字符串转换成大写
    String.valueOf( ) 返回字符串

  布尔值(Boolean)
  布尔(逻辑)只能有两个值:true 或 false。
    var x=true;
    var y=false;

  Boolean对象相关属性
    Boolean.toString( ) 将布尔值转换成字符串
    Boolean.valueOf( ) Boolean对象的布尔值

  2、对象类型:
    数组(Array)
      var cars=new Array();
      cars[0]="Saab";
      cars[1]="Volvo";
      cars[2]="BMW";
    或者
      var cars=new Array("Saab","Volvo","BMW");

  Array对象相关属性
    Array.concat( ) 连接数组
    Array.join( ) 将数组元素连接起来以构建一个字符串
    Array.length 数组的大小
    Array.pop( ) 删除并返回数组的最后一个元素
    Array.push( ) 给数组添加元素
    Array.reverse( ) 颠倒数组中元素的顺序
    Array.shift( ) 将元素移出数组
    Array.slice( ) 返回数组的一部分
    Array.sort( ) 对数组元素进行排序
    Array.splice( ) 插入、删除或替换数组的元素
    Array.toLocaleString( ) 把数组转换成局部字符串
    Array.toString( ) 将数组转换成一个字符串
    Array.unshift( ) 在数组头部插入一个元素

  对象(Object)
   对象由花括号分隔。在括号内部,对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔:
    var person={firstname:"John", lastname:"Doe", id:5566};
    或者
    var person={
    firstname : "John",
    lastname : "Doe",
    id : 5566
    };

  Object对象相关属性
    Object.constructor 对象的构造函数
    Object.hasOwnProperty( ) 检查属性是否被继承
    Object.isPrototypeOf( ) 一个对象是否是另一个对象的原型
    Object.propertyIsEnumerable( ) 是否可以通过for/in循环看到属性
    Object.toLocaleString( ) 返回对象的本地字符串表示
    Object.toString( ) 定义一个对象的字符串表示
    Object.valueOf( ) 指定对象的原始值

  空(null)
    null是JavaScript语言的关键字,它表示一个特殊值,常用来描述“空值”。

  未定义(Undefined)
    undfined是一个特殊值,表示变量未定义。

三、JavaScript函数

  3.1、函数语法:
  函数就是包裹在花括号中的代码块,前面使用了关键词 function:
    function 函数名(){
      执行代码
    }

  3.2、函数的分类

// 普通函数
function func() {
    return "yusheng_liang"
}
// 匿名函数
var func = function(arg){
    return "yusheng_liang";
};
// 自执行函数
(function(arg){
    console.log(arg);
})(123)

3.3、调用带参数的函数

  在调用函数时,您可以向其传递值,这些值被称为参数。这些参数可以在函数中使用。您可以发送任意多的参数,由逗号 (,) 分隔:
  语法:
    function myFunction(var1,var2){
      代码
    }

  示例:

<button onclick="myFunction(‘Harry Potter‘,‘Wizard‘)">Try it</button>

<script>
function myFunction(name,job)
{
    alert("Welcome " + name + ", the " + job);
}
</script>

 

3.4、带有返回值的函数
  有时,我们会希望函数将值返回调用它的地方。通过使用 return 语句就可以实现。在使用 return 语句时,函数会停止执行,并返回指定的值。
  语法:
    function myFunction(){
      var x=5;
      return x;
    }


以上是关于html--前端JavaScript基本内容的主要内容,如果未能解决你的问题,请参考以下文章

web前端基础知识-JavaScript基本操作

使用天码营前端预览工具:Web前端开发(HTML/CSS/JavaScript)实验

融职教育Web前端学习 第3章 JavaScript基础教程10 正则表达式

javascript制作图javascript制作图片无限懒加载,轻松又实用片无限懒加载,轻松又实用

2019前端面试经典(html5+css3+JavaScript)

前端学习结束总结