ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

【学习笔记】JavaScript基础

2021-07-31 20:00:20  阅读:178  来源: 互联网

标签:浏览器 JavaScript 笔记 JS 学习 字符串 123 var 转换


JavaScript基础

初识JavaScript

1. 什么是JavaScript

  • 运行在客户端的脚本语言,创始人Brendan Eich
  • 脚本语言,不需要编译,编译是在代码执行直接编译生成中间代码文件如exe,解释器是在代码运行时进行解释并立即执行
  • 可基于Node.js技术进行服务器端编程

2. 浏览器执行JS

浏览器分为渲染引擎和JS引擎两部分

  • 渲染引擎: 解析HTML和CSS,俗称内核,如chrome的blink
  • JS引擎: 也成为JS解释器,用来读取网页中的JS代码,如chrome中的V8(号称最快的JS引擎)

3. JS的组成

  • ECMAScript: 规定了JS的编程语法和基础知识,是所有浏览器厂商共同遵守的一套JS语法工业标准
  • DOM: 文档对象模型,是W3C组织推荐的处理可扩展置标语言的标准编程接口。通过DOM可操作页面上的各种元素(大小、位置、颜色等)。
  • BOM: 浏览器对象模型,它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过BOM可操作浏览器窗口,比如弹出框、控制浏览器跳转、分辨率等。

4. JS的三种书写方式

  • 行内式: 直接写在元素内部
    <!-- 行内式的JS直接写到元素内部 -->
    <input type="button" value="点一下" onclick="alert('行内式')">
    
  • 内嵌式: 写在<head><body>标签中
    <!-- 写在`<head>`或`<body>`中的<script>标签内 -->
     <script>alert('内嵌式')</script>
    
  • 外联式:
    <!-- 放置与外部文件中 -->
     <script src="test.js"></script>
    

JS语言基础

1. 注释

  • 单行注释
//单行注释 ctrl + /
  • 多行注释
/*
多行行注释 shift + alt + a
*/

2. JS输入输出语句

方法说明归属
alert(msg)浏览器弹出警示框浏览器
console.log(msg)浏览器控制台打印输出信息浏览器
prompt(msg)浏览器弹出输入框,用户可输入浏览器

3. 变量

JavaScript 变量是存储数据值的容器,通过变量获取数据。 JavaScript 变量必须以唯一的名称的标识。

  • 变量命名规范:
    • 名称必须以字母开头
    • 名称可包含字母、数字、下划线和美元符号
    • 名称也可以$_开头,一般不这么做
    • 名称对大小写敏感
    • 名称不能使用保留字,如var
    • 驼峰命名规范: 首单词的首字母小写,后面单词的首字母大写

4. 标识符、保留关键字

标识符

开发人员为变量、属性、函数、参数等取的名字,不能是关键字和保留字

保留关键字

在 JavaScript 中,一些标识符是保留关键字,不能用作变量名或函数名。

  • 用星号标记的关键词是 ECMAScript 5 和 6 中的新词。
    abstractargumentsawait*boolean
    breakbytecasecatch
    charclass*constcontinue
    debuggerdefaultdeletedo
    doubleelseenum*eval
    export*extends*falsefinal
    finallyfloatforfunction
    gotoifimplementsimport*
    ininstanceofintinterface
    let*longnativenew
    nullpackageprivateprotected
    publicreturnshortstatic
    super*switchsynchronizedthis
    throwthrowstransienttrue
    trytypeofvarvoid
    volatilewhilewithyield

5. JS数据类型

基本数据类型

Number、String、Boolean、Undefined、Null

1) 数字Number

与许多其他编程语言不同,JavaScript 不会定义不同类型的数,比如整数、短的、长的、浮点的等等。JavaScript 数值始终以双精度浮点数来存储,根据国际 IEEE 754 标准。此格式用 64 位存储数值。使用isNaN()判断是否非数字,非数字返回true

指数符号
52bits11bits1bits
0-5252-6263
  • 精度:
    • 整数(不使用指数或科学计数法)会被精确到 15 位。
    • 小数的最大数是 17 位,但是浮点的算数并不总是 100% 精准
    /*精度*/
    var a = 999999999999999;   // x 将是 999999999999999
    var b = 9999999999999999;  // y 将是 10000000000000000
    var c = 0.2 + 0.1;         // x 将是 0.30000000000000004
    /*特殊值*/
    var d = Number.MAX_VALUE   // 最大值:1.7976931348623157e+308
    var e = Number.MIN_VALUE   // 最小值:5e-32
    var f = Infinity	       // 无穷大
    var g = NaN 			   // 非数字
    
  • 进制的前缀
    二进制八进制十六进制
    0b00x

2)字符串String

JavaScript 字符串是引号中的零个或多个字符。可以使用''"",推荐使用'',因为HTML标签内的属性使用""

  • 字符串长度
    内建属性length可返回字符串的长度
    var str = "ABCDEFG";
    var strLength = str.length;
    
  • 特殊字符——转义
    转义符含义
    \n换行
    \\
    ""
    \b退格
    \r回车
    \t水平制表符,tab 缩进
    \v垂直制表符
    \f换页
  • 字符串拼接
    • 使用+对字符串进行拼接
    • 字符串和字符串的拼接
    • 字符串和其他类型的拼接
    var x = "123" + "456";	// x = "123456"
    var y = "123" + 456;	// y = "123456"
    var z = "123" + true;	// z = "123true"
    

2)布尔类型Boolean

布尔类型有两个值:truefalse

var x = true + 1;	// x = 2
var y = false + 1;	// y = 1

3)Undefined 和Null

一个变量申明后未被赋值默认值为undefined,声明变量可以给undefinednull

var x = undefined + "123"	// x = "undefined123"
var y = undefined + 123     // x = NaN
var z = null + "123"	    // z = "null123"
var r = null + 123	        // r = 123

5)typeof

typeof方法返回数据类型,返回结构有以下几种

  • string
  • number
  • boolean
  • undefined
  • function
  • object
typeof "Bill"              		// 返回 "string"
typeof 3.14                		// 返回 "number"
typeof true                		// 返回 "boolean"
typeof false               		// 返回 "boolean"
typeof x                   		// 返回 "undefined" (假如 x 没有值)
typeof {name:'Bill', age:62} 	// 返回 "object"
typeof [1,2,3,4]             	// 返回 "object" (数组即对象)
typeof null                  	// 返回 "object"
typeof function myFunc(){}   	// 返回 "function"

4)数据类型的转换

  • 转换为字符串
    转换方式说明
    变量.toString()转换为字符串
    String()强制转换为字符串
    +通过拼接转换为字符串,隐式转换
    • 变量.toString()和String()的区别:
      • 变量.toString()不能转Undefined和null可以转换进制数据传参2、8、10、16即可
      • String()可以将null和undefined转换为字符串,但不能转换进制字符串
  • 转换为数字型
    转换方式说明
    parseInt(string)将string类转换为整数数值型
    parseFloat(string)将string类转换为浮点数数值型
    Number()强制转换为数值型
    - * /通过算式运算转换,隐式转换
    • 区别:
    /*parseInt()*/
    var num1=parseInt("num123");    //NaN
    var num2=parseInt("");          //NaN
    var num3=parseInt("123.45")     //123
    var num4=parseInt("101010",2)   //42
    var num5=parseInt("123num")     //123
    var num6=parseInt("0xff")       //255
    /*parseFloat(string)*/
    var num1=parseFloat("1234blue");    //1234
    var num2=parseFloat("0xA");         //0
    var num3=parseFloat("0908.5");      //908.5
    var num4=parseFloat("3.125e7");     //31250000
    var num5=parseFloat("123.45.67")    //123.45
    var num6=parseFloat("")             //NaN
    var num7=parseFloat("num123")       //NaN
    /*Number()*/
    var num1=Number("Hello World");  //NaN
    var num2=Number("");             //0
    var num3=Number("000011");       //11
    var num4=Number(true);           //1
    var num5=Number("num123")       //NaN
    /*隐式转换*/
    var num1 = '12' - 0				// 12
    var num2 = '123' - '190'		// 3
    var num2 = '123' * '1'			// 123
    
  • 转换为布尔型
    使用Boolean()进行转换
    falsetrue
    ‘’、0、NaN、null、undefined其他所有值

复杂数据类型

object类型,在后面重点讲到

6. JS运算符

待续…

标签:浏览器,JavaScript,笔记,JS,学习,字符串,123,var,转换
来源: https://blog.csdn.net/hehao1421771020/article/details/119277812

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有