Home > Web Front-end > JS Tutorial > Basic knowledge of Javascript&DHTML

Basic knowledge of Javascript&DHTML

PHP中文网
Release: 2016-05-16 19:03:05
Original
1260 people have browsed it

First of all, please download the JScript.chm manual. No matter whether you are a novice or an expert, a manual is inevitable, especially for novices. If you have not flipped through the Rhino book, then this manual will be your first choice to understand this language. Most of the things mentioned below may not be mentioned in the manual, or may be mentioned very little.

The following tutorials are written based on your understanding of the JScript.chm manual mentioned above. If you have not read JScript.chm, it is recommended that you download it first and read the manual. , while watching the tutorial.

The syntax of JS is similar to that of most C-like languages. The difference is only in its own characteristics. Therefore, I will not write more about the specific content of the grammar. You should understand it by reading the manual.

The five major objects of JS: String, Number, Boolean, Object, Function.

Four types of JS loops:

for(var i=0; i<n; i++) {} 
do {} while(true); 
while(true) {} 
for (var i in collection) {}
Copy after login

Exception handling:

try {} catch(aVariable){}
Copy after login

I won’t list the JS syntax one by one, here are just a few Some explanations of several major objects of JS may not be mentioned in the manual.

1. String.
Strings are the most commonly used. There are at least two ways to force conversion into a string:
1. Use the string connector " ". In JS, if the number is an operation, it is addition, if it is a string, it is concatenation, for example:

<script> 
var a_number = 1000 
var a_string = a_number + ""; 
</script>
Copy after login

2. Use String to force conversion (String).

<script> 
var a_number = 1000 
var a_string = String(a_number); 
</script>
Copy after login

One thing to note here is that the above is forced transformation, and there is no "new" keyword before String. If you add the new keyword, you will get a String object. Objects can contain properties and methods, but strings cannot. A comparison can be made as follows:

<script> 
var a_number = 1000 
var a_string = String(a_number); 
a_string.property = "js"; 
alert(a_string.property) //将提示undefined 
var a_object = new String(a_number) 
a_object.property = "js"; 
alert(a_object.property) //将提示js 
</script>
Copy after login

So, there is a difference between new and no new. This is true for Number and Boolean, so I won’t say more about this transformation in the future.

2. Number.
Here we also talk about the issue of transformation.
In addition to using Number to force conversion, you can also use parseInt and parseFloat to convert to integer or floating point type. If it is not a number after conversion, then NaN (Not a Number) will be returned. At this time, you can use the isNaN function to judge. Here you can check the manual to see the syntax inside. By the way, remember this function.

3. Boolean.
This one is a bit more troublesome, because the processing of it in JS is rather strange.
In addition to what the JScript manual says: "
An expression whose value is true or false . Non-Boolean expressions can also be converted to Boolean values ​​if necessary, but the following rules must be followed:

All objects are treated as true if and only if the string is empty.
null and undefined are treated as false if and only if. When the number is zero, the number is treated as false. "
" In addition, you should also note:

First of all, before it is cast to a Boolean type, that is, when it is not true or false
1. In digital conditional judgment, there are generally three situations: 0, negative number, positive number. As long as it is non-0, it is true. The following is an example.


Note: The conditional judgment in the above example directly judges the conditional statement. If we change the conditional statement to:
<script> 
var a = 0; 
var b = -1; 
var c = 1; 
function assert (aVar) { 
if (aVar) alert(true); 
else alert(false); 
} 
assert(a) // false 
assert(b) // true 
assert(c) // true 
</script>
Copy after login


There will be negative numbers Very different results.
<script> 
var a = 0; 
var b = -1; 
var c = 1; 
function assert (aVar) { 
if (aVar==true) alert(true); 
else alert(false); 
} 
assert(a) // false 
assert(b) // false 
assert(c) // true 
</script>
Copy after login


2. In strings, you also need to pay attention to

Note: The conditional judgment in the above example directly judges the conditional statement. If If we change the conditional statement to:
<script> 
function assert (aVar) { 
if (aVar) alert(true); 
else alert(false); 
} 
var a="undefined"; 
var b="false"; 
var c=""; 
assert(a) // true 
assert(b) // true 
assert(c) // false 
</script>
Copy after login


, there will be completely different results. Therefore, be careful when dealing with this aspect.
<script> 
function assert (aVar) { 
if (aVar==true) alert(true); 
else alert(false); 
} 
var a="undefined"; 
var b="false"; 
var c=""; 
assert(a) // false 
assert(b) // false 
assert(c) // false 
</script>
Copy after login

Maybe some friends will be a little dizzy when they see this, so how can we make it as stated in the manual that only "", 0, null, and undefined can be false? There are at least two methods:

(1) Forced transformation:
1. Use the Boolean (aVar) mentioned above to transform.
2. Use the "not operator" to transform. For example, in the above example,

uses two negations to convert aVar into a Boolean type, which is equivalent to Boolean(aVar).
  <script> 
    function assert (aVar) { 
    if (!!aVar==true) alert(true); 
    else alert(false); 
    } 
    var a="undefined"; 
    var b="false"; 
    var c=""; 
    assert(a) // true 
    assert(b) // true 
    assert(c) // false 
    </script>
Copy after login

(2), congruent operator.
The identity operator is three equals "===", which is different from what is said above. It only performs comparisons of the same type. As mentioned in the above example, it only compares true or false. If compared with strings or numbers, both are false. Only when compared with true, is it true. Example:


4. Object.
<script> 
function assert (aVar) { 
if (aVar===true) alert(true); 
else alert(false); 
} 
var a="undefined"; 
var b=true; 
var c=1; 
assert(a) // false 
assert(b) // true 
assert(c) // false 
</script>
Copy after login
JS has at least the following two methods to create objects:


1. As mentioned above, use the new keyword. For example, new Number(100), new String("string"), new Object(), new customFunction(), etc.
This method is explained in detail in the manual, so I won’t go into details here.

2. You can also use curly brackets. For example

var o = {  
  m1:&#39;never-online.net&#39;, 
  m2:&#39;blog&#39;  
}
Copy after login

这种方法就比较省时省力了。利用这种方法来创建对象,需要注意的就是,
每个成员后有一个":"冒号,冒号后是该成员的内容。
其次就是,成员内容后有一个逗号",",但仅最后一个成员是没有逗号的。

五、函数(Function)。
函数在JS里的作用有两个,
一是做为一个普通函数一样被调用。
二是可以做为一个"类"(class)来使用。
第一条就没有什么可说明的了,手册上说得很清楚了,第二条就简要说明一下。
上面第四点里说到对象,除了创建JS本身的对象之外,需要创建一个类的实例,那么就必须先把“类”写出来。这个类就是Function。
比如:

<script> 
function myclass() { 
  this.m1="member--m1"; 
  this.m2="member--m2"; 
} 
var o = new myclass(); 
</script>
Copy after login

六、关于this和new关键字。

也许有些朋友还不太清楚这个this的作用是什么。这是面向对象里所提及的内容

这里也简单说一下,this就是“自己”的意思,而上面的的“自己”,就是指myclass。
举个例子来说myclass这个类就是一个模具,模具上有一个名字(m1),还有一个螺丝(m2),而new关键字就可以理解成“生产”。那么就可以把上面的代码理解成:

(模具 myclass)function myclass() { 
(模具myclass的名字是)this.m1="member--m1" 
(模具myclass上面的螺丝是)this.m2="member--m2"; 
}
Copy after login

按照模具myclass的样式生产一个产品o

var o= new myclass();
Copy after login

这个刚出炉的产品就有模具myclass的所有特性了。当然,我们可以按照这个模具的样式生产成千上万个。

如果我们愿意,我们还可以修改一下他的属性,比如,我生产完一个产品,想把他的名字换了。我们也可以这么做

var product = new myclass(); 
product.m1 = "newProduct"
Copy after login

上面这样讲解,希望能清楚一些。

基本把要说的基础知识简单的说了一些,JS的基础知识其实也有很多,知道有疏忽,但是又不便多写,写多了就烦琐了,只有走一步看一步了,看看还有什么不清楚的,才能再写出来了

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template