JavaScript 基础复习1(引用翻译了相当多的API)
2017-02-21 11:01
1321 查看
【本文引用翻译了相当多的API】
一、关于JavaScript引用格式
首先,创建一个“scripts”文件夹(用于存放JavaScript文件)。然后在新建的scripts文件夹下创建一个新的main.js文件。
index.html 文件,在 </body> 闭合标签之前加入
这基本上与引入 CSS 的 <link> 元素功能相同——它将 JavaScript 引入了页面,所以它将影响 HTML (包括 CSS 和其他页面上的任何内容)。
—————————————————————————————————————————————————
添加一个图像转换器
首先,找到另一个你想用来装饰你的网页的图片。确保它与你第一张图片尺寸相同,或者尽可能相似。
将图片保存在 images 文件夹。
重命名图片为 firefox2.pnga
—————————————————————————————————
获取按钮
在 index.html 里, 在 <script> 元素前添加下一行代码:
<button>Change user</button>
在 main.js 里,在文件底部添加下面的代码,抓去 按钮 或者可以 标题 的引用并将其存放在变量里:
var myButton = document.querySelector('button');
二、关于JavaScript基础复习
变量(Variables)
myVariable = 'Bob'
//js对变量大小写很敏感
运算符
语句
也就是常说的;终结一行语句。
函数
可以理解为方法,函数的定义是变量,任何函数都是数据,都可以当成参数或者对象。
【箭头函数】【很强大】【箭头函数语法仅在
Microsoft Edge 中受支持】【等同匿名函数,一种速记方法】
evens.map(v => v + 1);
evens.map((v, i) => v + i);
事件【★o★】【监听】
document.querySelector('html').onclick = function() {
alert('Ouch! Stop poking me!');
}
控制程序流
条件运算符
以for...in 循环【强大】为代表的循环语句
附录:
运算符优先级
一、关于JavaScript引用格式
首先,创建一个“scripts”文件夹(用于存放JavaScript文件)。然后在新建的scripts文件夹下创建一个新的main.js文件。
index.html 文件,在 </body> 闭合标签之前加入
<script src="scripts/main.js"></script>
这基本上与引入 CSS 的 <link> 元素功能相同——它将 JavaScript 引入了页面,所以它将影响 HTML (包括 CSS 和其他页面上的任何内容)。
—————————————————————————————————————————————————
添加一个图像转换器
首先,找到另一个你想用来装饰你的网页的图片。确保它与你第一张图片尺寸相同,或者尽可能相似。
将图片保存在 images 文件夹。
重命名图片为 firefox2.pnga
var myImage = document.querySelector('img');//在程序中声明html中的图片对象 myImage.onclick = function() { //绑定出发功能 var mySrc = myImage.getAttribute('src'); if(mySrc === 'images/firefox-icon.png') { myImage.setAttribute ('src','images/firefox2.png'); } else { myImage.setAttribute ('src','images/firefox-icon.png'); } }
—————————————————————————————————
获取按钮
在 index.html 里, 在 <script> 元素前添加下一行代码:
<button>Change user</button>
在 main.js 里,在文件底部添加下面的代码,抓去 按钮 或者可以 标题 的引用并将其存放在变量里:
var myButton = document.querySelector('button');
二、关于JavaScript基础复习
变量(Variables)
myVariable = 'Bob'
//js对变量大小写很敏感
变量 | 解释 | 示例 |
---|---|---|
String | 字符串,一段文本。 要指示变量是字符串,你应该将它们用引号包裹起来。 | var myVariable = 'Bob'; |
Number | 数字,一个数字。不用引号包围。 | var myVariable = 10; |
Boolean | 布尔型,一个 True/False (真 / 假)值。 true/ false是 JS 里的特殊关键字,不需要引号。 | var myVariable = true; |
Array | 数组,一种允许你存储多个值在一个引用里的结构。 | var myVariable = [1,'Bob','Steve',10]; 调用数组的元素只需: myVariable[0], myVariable[1], 等等. |
Object | 对象,基本上 JavaScript 里的任何东西都是对象,而且都可以被储存在变量里。将这个记在脑子里。 | var myVariable = document.querySelector('h1'); 上面所有示例都是对象。 |
描述 | 符号 |
---|---|
删除 | delete |
typeof | typeof |
void | void |
instanceof | instanceof |
new | new |
in | in |
描述 | 符号 |
---|---|
按位“非” | ~ |
按位左移 | << |
按位右移 | >> |
无符号右移 | >>> |
按位“与” | & |
按位“异或” | ^ |
按位“或” | | |
描述 | 符号 |
---|---|
逻辑“非” | ! |
小于 | < |
大于 | > |
小于或等于 | <= |
大于或等于 | >= |
相等 | == |
不相等 | != |
逻辑“与” | && |
逻辑“或” | || |
有条件的(三元) | ?: |
逗号 | , |
严格相等 | === |
严格不等 | !== |
运算符 | 解释 | 符号 | 示例 |
---|---|---|---|
加/连接 | 用来相加两个数字,或者连接两个字符串。 | + | 6 + 9; "Hello " + "world!"; |
减、乘、除 | 这些运算符操作将与你期望它们在基础数学中所做的一样。 | -, *, / | 9 - 3; 8 * 2; // JS中的乘是一个"*"号; 9 / 3; |
赋值运算符 | 你之前已经见过这个符号了:它将一个值赋给一个变量 | = | var myVariable = 'Bob'; |
相等 | 它将测试两个值是否相等,而且会返回一个 true/ false(布尔型)值。 | === | var myVariable = 3; myVariable === 4; |
非,不等 | 经常与相等运算一起使用,非运算符在JS中表示逻辑非——它也返回一个布尔值。 | !, !== | 原本的值是 true ,但是返回了 false 因为之后我们做了非运算:var myVariable = 3; !myVariable === 3; 这里我们测试了"我的 myVariable是否等于 3". 这里返回了 false, 因为它等于 3.
myVariable !== 3; |
也就是常说的;终结一行语句。
函数
可以理解为方法,函数的定义是变量,任何函数都是数据,都可以当成参数或者对象。
【箭头函数】【很强大】【箭头函数语法仅在
Microsoft Edge 中受支持】【等同匿名函数,一种速记方法】
evens.map(v => v + 1);
evens.map((v, i) => v + i);
事件【★o★】【监听】
document.querySelector('html').onclick = function() {
alert('Ouch! Stop poking me!');
}
控制程序流
条件运算符
以for...in 循环【强大】为代表的循环语句
计数器 prop 包含当前属性的名称或当前数组元素的索引。 // Create an object with some properties var myObject = new Object(); myObject.name = "James"; myObject.age = "22"; myObject.phone = "555 1234"; // Enumerate (loop through)_all the properties in the object for (var prop in myObject) { // This displays "The property 'name' is James", etc. document.write("The property '" + prop + "' is " + myObject[prop]); // New line. document.write("<br />"); }
break 和 continue 语句
附录:
数字 | 描述 | 等效十进制数字 |
---|---|---|
.0001、0.0001、1e-4、1.0e-4 | 四个等效的浮点数字。 | 0.0001 |
3.45e2 | 浮点数。 | 345 |
45 | 一个 Integer。 | 45 |
0378 | 一个 Integer。 虽然此值看上去像一个八进制数字(因为以零开头),但 8 不是有效的八进制数字,因此将被视为十进制数字。 | 378 |
0377 | 一个八进制整数。 注意:虽然它看上去只比上面那个数字小 1,但它们的实际值相差甚远。 | 255 |
0.0001 | 一个浮点数字。 即使此值以零开头,它也不是八进制数字,因为它有小数点。 | 0.0001 |
00.0001 | 这是一个错误。 两个前导零将数字标记为八进制数字,但八进制数字不能有小数部分。 | N/A(编译器错误) |
0Xff | 十六进制整数。 | 255 |
0x37CF | 十六进制整数。 | 14287 |
0x3e7 | 十六进制整数。 注意:“e”不被视为幂。 | 999 |
0x3.45e2 | 这是一个错误。 十六进制数字不能有小数部分。 | N/A(编译器错误) |
运算符 | 说明 |
---|---|
.[ ] ( ) | 字段访问、数组索引、函数调用和表达式分组 |
++ -- - ~ ! delete new typeof void | 一元运算符、返回数据类型、对象创建、未定义的值 |
* / % | 相乘、相除、求余数 |
+ - + | 相加、相减、字符串串联 |
<< >> >>> | 移位 |
< <= > >= instanceof | 小于、小于或等于、大于、大于或等于、是否为特定类的实例 |
== != === !== | 相等、不相等、全等,不全等 |
& | 按位“与” |
^ | 按位“异或” |
| | 按位“或” |
&& | 逻辑“与” |
|| | 逻辑“或” |
?: | 条件运算 |
= OP= | 赋值、赋值运算(如 += 和 &=) |
, | 多个计算 |
相关文章推荐
- ASP.NET AJAX 说明文档->客户端引用->全局命名空间->JavaScript 基础类型扩展->Array 类型扩展->clone 函数
- ASP.NET AJAX 说明文档->客户端引用->全局命名空间->JavaScript 基础类型扩展->Array 类型扩展->contains 函数
- JavaScript 基础 引用对象
- Javascript基础复习 匿名函数和闭包
- 复习关于Javascript的语言基础运用和语法
- ASP.NET AJAX 说明文档->客户端引用->全局命名空间->JavaScript 基础类型扩展->Array 类型扩展
- Javascript基础复习 运算符Operators
- TC官方文档翻译02----基础API(Tokyo Cabinet/Tokyo Tyarnt 文档系列)
- Java媒体架构基础(jmf文档中文翻译)相当不错
- Javascript基础复习 程序阅读理解
- ASP.NET AJAX 说明文档->客户端引用->全局命名空间->JavaScript 基础类型扩展->Array 类型扩展->clear 函数
- Javascript & DHTML DOM基础和基本API第1/5页
- JavaScript基础之引用外部JS文件
- 复习一下基础:'C# 值类型和引用类型 以及作为方法参数的区别'
- 实现通用 Web CAPTCHA 图形验证码 JavaScript 脚本 API 服务 (JavaScript 脚本动态页面引用)
- Javascript & DHTML 实例编程(教程)DOM基础和基本API
- [翻译]javascript学习笔记 (一)-函数基础
- ASP.NET AJAX 说明文档->客户端引用->全局命名空间->JavaScript 基础类型扩展->Array 类型扩展->addRange 函数
- javascript基础知识复习
- Javascript基础复习 数据类型